For using [(ngModel)] in Angular 2, 4 & 5+, you need to import FormsModule from Angular form...
Also, it is in this path under forms in the Angular repository on GitHub:
angular / packages / forms / src / directives / ng_model.ts
Probably this is not a very pleasurable for the AngularJS developers as you could use ng-model everywhere anytime before, but as Angular tries to separate modules to use whatever you'd like you to want to use at the time, ngModel is in FormsModule now.
Also, if you are using ReactiveFormsModule it needs to import it too.
So simply look for app.module.ts and make sure you have FormsModule imported in...
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms'; // <<<< import it here
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule, FormsModule // <<<< And here
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Also, these are the current starting comments for Angular4 ngModel in FormsModule:
/**
* `ngModel` forces an additional change detection run when its inputs change:
* E.g.:
* ```
*
{{myModel.valid}}
*
* ```
* I.e. `ngModel` can export itself on the element and then be used in the template.
* Normally, this would result in expressions before the `input` that use the exported directive
* to have and old value as they have been
* dirty checked before. As this is a very common case for `ngModel`, we added this second change
* detection run.
*
* Notes:
* - this is just one extra run no matter how many `ngModel` have been changed.
* - this is a general problem when using `exportAs` for directives!
*/
If you'd like to use your input, not in a form, you can use it with ngModelOptions and make standalone true...
[ngModelOptions]="{standalone: true}"