Can't Bind to 'Ngmodel' Since It Isn't a Known Property of 'Input'

Can't bind to 'ngModel' since it isn't a known property of 'input'

Yes, that's it. In the app.module.ts file, I just added:

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

[...]

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

Angular error: Can't bind to 'ngModel' since it isn't a known property of 'input'

In order to use two-way data binding for form inputs you need to import the FormsModule package in your Angular module.

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

@NgModule({
    imports: [
         FormsModule      
    ]

---

EDIT

Since there are lot of duplicate questions with the same problem, I am enhancing this answer.

There are two possible reasons

• Missing FormsModule, hence Add this to your Module,

  import { FormsModule } from '@angular/forms';
  
  @NgModule({
      imports: [
          FormsModule      
      ]
  

• Check the syntax/spelling of [(ngModel)] in the input tag

Angular Binding errror - Can't bind to 'ngModel' since it isn't a known property of 'input' even though the property exists

In order to use ngModel directive and general data binding with Angular, you will need to first import Angular's FormsModule in your module.

To do this, know what module your component is contained. And then add FormsModule in the list of imports.

For example, you can import this to the app.module.ts:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    NgbModule,
    FormsModule // Insert here
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Make sure you add this at the top of your module file:

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

Angular 12 - Can't bind to 'ngModel' since it isn't a known property of 'input'

You need to use [(ngModel)] instead of [{ngModel}] on the input tag

<input type="text" [(ngModel)]="DepartmentName" />

Angular Can't bind to 'ngModel' With FormsModule already imported

After some times, I finally found it : I did not imported the UserPreferencesModule in the AppModule... So simple, yet so many times...
Have a nice day every one !

---

Related Topics