To Do List Angular 13

 app.component.html:-

<input type="text"  placeholder="Enter Item to Add in List" #task>

 

  <br/><br/>

 

  <button (click)="addItem(task.value)">Add Item</button>

  <br/><br/>

  <ul *ngFor="let item of listItems">

    <li>{{item.name}}</li>

   

    <button (click)="itemRemove(item.id)">Remove</button>

  </ul>

 

app.component.ts:-

listItems:any[]=[];

addItem(item:string)

{

  console.warn(item);

  this.listItems.push({id:this.listItems.length, name:item});

}

itemRemove(id:number)

{

console.warn(id)

this.listItems=this.listItems.filter(item=>item.id!=id)

}

Output:-