Не удается привязать к "formGroup", так как это не является известным свойством "form"

угловой 4 в сочетании с модули (если вы, например, используете общий модуль) требует, чтобы вы также экспортировали ReactiveFormsModule на работу.

import { NgModule }                                 from '@angular/core';
import { CommonModule }                             from '@angular/common';
import { FormsModule, ReactiveFormsModule }         from '@angular/forms';

@NgModule({
  imports:      [
    CommonModule,
    ReactiveFormsModule
  ],
  declarations: [],
  exports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule
  ]
})
export class SharedModule { } 

Ok после некоторого рытья я нашел решение для "не могу привязаться к "formGroup", поскольку это не известное свойство "form"."

для моего случая я использовал несколько файлов модулей, я добавил ReactiveFormsModule в app.модуль.ТС

 import { FormsModule, ReactiveFormsModule } from '@angular/forms';`

@NgModule({
  declarations: [
    AppComponent,
  ]
  imports: [
    FormsModule,
    ReactiveFormsModule,
    AuthorModule,
],
...

но это не работало, когда я использую директиву [formGroup] из компонента, добавленного в другой модуль, например, используя [formGroup] в author.деталь.ts, который подписан в author.модуль.файл ТС:

import { NgModule }       from '@angular/core';
import { CommonModule }   from '@angular/common';
import { AuthorComponent } from './author.component';

@NgModule({
  imports: [
    CommonModule,
  ],
  declarations: [
    AuthorComponent,
  ],
  providers: [...]
})

export class AuthorModule {}

Я думал если я добавил ReactiveFormsModule в приложение.модуль.ts, по умолчанию ReactiveFormsModule будет унаследован всеми его дочерними модулями, такими как author.модуль в этом случае... (неверно!). Мне нужно было импортировать ReactiveFormsModule в author.модуль.ТС для того, чтобы сделать все директивы для работы:

...
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
...

@NgModule({
  imports: [
    ...,
    FormsModule,    //added here too
    ReactiveFormsModule //added here too
  ],
  declarations: [...],
  providers: [...]
})

export class AuthorModule {}

Итак, если вы используете подмодули, обязательно импортируйте ReactiveFormsModule в каждый файл подмодуля. Надеюсь, это поможет кому-нибудь.

предложенный ответ не работал для меня с Angular 4. Вместо этого мне пришлось использовать другой способ обязательные С attr префикс:

<element [attr.attribute-to-bind]="someValue">

Если у вас есть два модуля, добавьте вот так

import {ReactiveFormsModule,FormsModule} from '@angular/forms';
@NgModule({
  declarations: [
    AppComponent,
    HomeComponentComponent,
    BlogComponentComponent,
    ContactComponentComponent,
    HeaderComponentComponent,
    FooterComponentComponent,
    RegisterComponent,
    LoginComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routes,
    ReactiveFormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})

я столкнулся с этой ошибкой во время модульного тестирования компонента (только во время тестирования, в приложении он работал нормально). Решение заключается в импорте ReactiveFormsModule на :

// Import module
import { ReactiveFormsModule } from '@angular/forms';

describe('MyComponent', () => {
    beforeEach(async(() => {
        TestBed.configureTestingModule({
            declarations: [MyComponent],
            imports: [ReactiveFormsModule],  // Also add it to 'imports' array
        })
        .compileComponents();
    }));
});

имейте в виду, что если вы определили "модули функций", вам нужно будет импортировать в модуль функций, даже если вы уже импортировали в AppModule. Из угловой документации:

модули не наследуют доступ к компонентам, директивам или каналам, объявленным в других модулях. Какой модуль импорта не имеет отношения к ContactModule и наоборот. Прежде чем ContactComponent сможет связываться с [(ngModel)], его ContactModule должен импортировать FormsModule.

https://angular.io/docs/ts/latest/guide/ngmodule.html

для людей, прогуливающихся по этим потокам об этой ошибке. В моем случае у меня был общий модуль, где я экспортировал только FormsModule и ReactiveFormsModule и забыл импортировать его. Это вызвало странную ошибку, что formgroups не работает в суб компонентов. Надеюсь, это поможет людям почесать в затылке.

эта проблема возникает из-за отсутствия импорта FormsModule,ReactiveFormsModule .Я тоже пришел с той же проблемой. Мое дело было другим. как я работал с модулями.Поэтому я пропустил выше импорта в моих родительских модулях, хотя я импортировал его в дочерние модули, он не работал.

затем я импортировал его в свои родительские модули, как показано ниже, и он работал!

import { ReactiveFormsModule,FormsModule  } from '@angular/forms';
import { AlertModule } from 'ngx-bootstrap';

         @NgModule({
          imports: [
            CommonModule,
            FormsModule,
            ReactiveFormsModule,
    ],
      declarations: [MyComponent]
    })

я столкнулся с этой ошибкой при попытке сделать тестирование e2e, и это сводило меня с ума, что на это нет ответов.

ЕСЛИ ВЫ ПРОВОДИТЕ ТЕСТИРОВАНИЕ,найти свой *.характеристики.файл TS и добавить :

import {ReactiveFormsModule, FormsModule} from '@angular/forms';

небольшое примечание: будьте осторожны с загрузчиками и минимизируйте (Rails env.):

увидев эту ошибку и попробовав каждое решение, я понял, что что-то не так с моим загрузчиком html.

Я установил среду Rails для импорта HTML-путей для моих компонентов успешно с помощью этого загрузчика (config/loaders/html.js.):

module.exports = {
  test: /\.html$/,
  use: [ {
    loader: 'html-loader?exportAsEs6Default',
    options: {
      minimize: true
    }
  }]
}

после нескольких часов усилий и бесчисленных импорта ReactiveFormsModule я увидел, что мой formGroup был маленьким письма:formgroup.

это привело меня к загрузчику и тот факт, что он downcased мой HTML на минимизации.

после изменения параметров все работало так, как должно, и я снова мог плакать.

Я знаю, что это не ответ на вопрос, но для будущих посетителей Rails (и других с пользовательскими загрузчиками) я думаю, что это может быть полезно.

Can't bind to 'formGroup' since it isn't a known property of 'form'

означает, что вы пытаетесь связать свойство с помощью angular ([prop]) но угловой не может найти ничего, что он знает для этого элемента (в этом случае form).

это может произойти, не используя правильный модуль (отсутствует импорт где-то в пути), а иногда просто вызвать опечатку, как:

[formsGroup] С s после form