Если у Вас есть эта проблема, когда Вы разрабатывающий компонент, таким образом, необходимо добавить эти два модуля к самому близкому модулю:
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
@NgModule({
declarations: [
AppComponent
],
imports: [
// other modules
FormsModule,
ReactiveFormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
И если Вы разрабатываете тест для своих компонентов, таким образом, необходимо добавить этот модуль к тестовому файлу как это:
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ContactusComponent } from './contactus.component';
import { ReactiveFormsModule } from '@angular/forms';
describe('ContactusComponent', () => {
let component: ContactusComponent;
let fixture: ComponentFixture<ContactusComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ContactusComponent],
imports:[
ReactiveFormsModule
]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ContactusComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
Ошибка говорит, что FormGroup не распознан в этом модуле. Таким образом, необходимо импортировать их (ниже) модулей в каждый модуль , который использует , FormGroup
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
Затем добавляет FormsModule и ReactiveFormsModule в Ваш Модуль массив импорта.
imports: [
FormsModule,
ReactiveFormsModule
],
можно ли думать, что я уже добавил его в [1 112] AppModule, и это должно наследоваться ему? Но это не. потому что эти модули экспортируют требуемые директивы, которые доступны только в импорте модулей. Читайте больше здесь... https://angular.io/guide/sharing-ngmodules.
Другими факторами для этих ошибок может быть ошибка написания как ниже...
[FormGroup] = "форма" Капитал F вместо маленького f
[formsGroup] = "форма" Дополнительный s после формы
Примечание : если Вы работаете компонент внутреннего дочернего модуля, то u просто должны импортировать ReactiveFormsModule в дочернем модуле, а не родительском корневом модуле приложения
После того как я добавил свой модуль к AppModule
, все начало хорошо работать.
Не будьте немыми немыми как я. Получал ту же ошибку как выше, НИ ОДНА из опций в этом потоке не работала. Затем я понял, что капитализировал 'F' в FormGroup. Doh!
[FormGroup]="form"
Импорт ReactiveFormsModule в соответствовавшем модуле