Angular 6: Can't bind to 'formGroup' since it isn't a known property of 'form'?

Add below code in your app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

and in imports array:

imports: [
        BrowserModule,
        FormsModule,
        ReactiveFormsModule
    ]

The FormGroup is a selector for the FormGroupDirective Directive which mainly used to Binds an existing FormGroup to a DOM element and FormGroupDirective is available in the ReactiveFormsModule module.


So fiddling around with the same frustrating issue -- a clean angular-cli install and a custom subcomponent/module (component.html... ) and the same error ("Can't bind to 'formGroup' since it isn't a known property of 'form' "). Angular CLI: 7.2.3, Node: 10.9.0, OS: win32 x64, Angular: 7.2.2

I finally got it to work based on the above but with a twist I put the FormsModule & ReactiveFormsModule imports in app-routing.module.ts (not app.module.ts) + the subcomponent's ts (in my case: forms-demo.component.ts) :

import { FormsModule, ReactiveFormsModule } from '@angular/forms';
....
@NgModule({
  imports: [
    RouterModule.forRoot(routes), 
    FormsModule, ReactiveFormsModule
....

Afterward ng build/serve worked without any errors.

I'm not an Angular expert but my guess is that the v7 approach whereby app.module.ts delegates to app-routing, that latter file is where the app & component imports & dependencies take place.... YMMV but hopefully it helps.