[SOLVED] error TS2322: Type 'Event' is not assignable to type 'boolean'

Issue

I‘m writing a todolist demo.
When ng serve it, it shows an error:

Error: src/app/app.component.html:17:58 - error TS2322: Type 'Event' is not assignable to type 'boolean'.
17  <input class="toggle" type="checkbox" [(ngModule)]="todo.isDone" >
                                                       ~~~~~~~~~~~~~~
18 
19  <label>{{ todo.title }}</label>
   ~~

Also all items not be checked.(even their isDone status is true)

I def an object in app.component.ts.

public todos:{
    id:number,
    title: string,
    isDone: boolean
  }[]=todos

const todos=[
  {
  id:1,
  title:'study',
  isDone:true
},{
  id:2,
  title:'sleep',
  isDone:true
},{
  id:3,
  title:'drink',
  isDone:true
}
]

app.component.html as below.

<li *ngFor="let todo of todos">
                <div class="view">
                    <input class="toggle" type="checkbox" [(ngModule)]="todo.isDone" >
                    <label>{{ todo.title }}</label>
                    <button class="destroy"></button>
                </div>
                <input class="edit" value="Create a TodoMVC template">
            </li>

Can anyone see what I’m doing wrong?
thanks!

Solution

change you code from <input class="toggle" type="checkbox" [(ngModule)]="todo.isDone" > to this…

<input class="toggle" type="checkbox" [(ngModel)]="todo.isDone" >

Here, ngModule is not recognizing..

Answered By – GaurangDhorda

Answer Checked By – Senaida (BugsFixing Volunteer)