CODEWITHSUNDEEP
angularangular-materialangular5angular-material-5
d4rty
d4rty

Reputation: 4188

Can't bind to 'ngModel' since it isn't a known property of 'mat-slide-toggle'

I am trying to get the current value of a mat-slide-toggle but unfortunatly I will get an error:

Error: Template parse errors:
Can't bind to 'ngModel' since it isn't a known property of 'mat-slide-toggle'.

I am using the toggle like this in the html part of my component:

 <mat-slide-toggle color="primary" [(ngModel)]="showInnerView">
      Default Slide Toggle
 </mat-slide-toggle>

Corresponding property in my component:

showInnerView: boolean = false;

What I am doing wrong?

Documentation of mat-slide-toggle

Official example of mat-slide-toggle together with [(ngModel)]

Used Versions: Angular: 5.2.4, Angular Material: 5.2.0

Upvotes: 24

Views: 16797

Answers (3)

Tomer Atzmon
Tomer Atzmon

Reputation: 9

i had the same problem, after running

ng serve

it was fixed

Upvotes: -1

Mezo Istvan
Mezo Istvan

Reputation: 2772

ngModel lives in FormsModule of @angular/forms, so import that to your AppModule (or whichever module you are trying to use it in).

Also see this question: Angular 2 two way binding using ngModel is not working

Upvotes: 34

Derviş Kayımbaşıoğlu
Derviş Kayımbaşıoğlu

Reputation: 30565

Please try to include FormsModule in your corresponding Module like below

@NgModule({
imports: [ BrowserModule, FormsModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})

Upvotes: 15

Related Questions