How to Fix Can’t bind to ‘ngModel’ since it isn’t a known property of ‘input’

by

Can’t bind to ‘ngModel’ since it isn’t a known property of ‘input’ error typically occurs when you are using the [(ngModel)] two-way data binding directive in Angular but forget to import “FormsModule” in app.module.ts file.

To fix the Can’t bind to ‘ngModel’ since it isn’t a known property of ‘input’ error in Angular, import the FormsModule in your app.module.ts file and add the FormsModule to the imports array of your module’s @NgModule decorator.

Here is the step-by-step guide for doing this:

Step 1: Import FormsModule in the app.module.ts file

Import the FormsModule in the app.module.ts file.

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

Step 2: Add FormsModule to the imports array in the @NgModule decorator

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

@NgModule({
  declarations: [
    // your components here
  ],
  imports: [
  BrowserModule,
  FormsModule, // <-- add this line
    // other modules here
  ],
  bootstrap: [AppComponent]
})

export class AppModule { }

After doing this, the ngModel directive should work correctly in your templates.

If you use reactive forms, you might also want to import and add the ReactiveFormsModule similarly.

This solution applies to any version of Angular and fixes the error for every version.

Related posts

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

Leave a Comment