FormsModule Error - Can't bind to 'ngModel' since it isn't a known property of 'input'.

[neil-gilbert]

Using the latest template from Steve (Angular 4.0), #930

I've added the following lines to app.module.client.ts file :
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
and added them both to the Imports[]

I then ran the following command : webpack --config webpack.config.vendor.js

I've added a form into my app and keep getting the following error : Can't bind to 'ngModel' since it isn't a known property of 'input'.

If i comment out the form from the HTML it works ok...... but if i then un-comment the form it then works ok (i.e. the form works and no errors are displayed)
It seems that something is happening in the HMR to make this work but I'm not sure what!?

[arun-haridas]

Make sure that the binded property in exists .

[SteveSandersonMS]

It's not enough to add them to app.module.client.ts, because that's only for client-side execution. You need them to be enabled for server-side execution too. Try adding them to app.module.ts, which is shared by both.

[pawanraocse]

You need to import the FormsModule
Open app.module.ts
and add line
import { FormsModule } from '@angular/forms';

and
@NgModule({
imports: [
FormsModule
],
})