How to select all checkboxes in Angular?

Question

I have already selected all checkbox.

selectAllCheckbox(): void {
  for (const task of this.tasks) {
  task.done = true;
 }
}

Now I need to check it and dis select all checkbox.

Answer 1

You're making it hard on yourself,

A simple way is to construct a single variable and use [(ngMode)] to control all checked boxes

For deep understanding,

In your .html

 <section class="example-section">
      <mat-checkbox [(ngModel)]="checker">First</mat-checkbox>
      <mat-checkbox [(ngModel)]="checker">Second</mat-checkbox>
      <mat-checkbox [(ngModel)]="checker">Third</mat-checkbox>
 </section>

  <button (click)="changeChecker()"></button>

And in your .ts file

export class Home {
 checker:boolean = true;

 constructor(){}

 changeChecker() {
   this.checker = !this.checker;
 }

}