[Fixed] How to get the value from angular material checkbox

Issue

I have a list of checkboxes:

    <section *ngFor="let item of list">
      <mat-checkbox [checked]="item.value" (click)="toggle(_checkbox_value_here_)">{{item.key}}</mat-checkbox>
    </section>

I need to pass the checkbox value (_checkbox_value_here_) to my function, how would you do that?

I can see this related question How to get checkbox data in angular material but really is there a way go achieve that without using ngModel and reactive forms?

Solution

The click event on the checkbox is just the native click event, which
doesn’t know anything about the checkbox itself. Using the change
event or just getting a handle on the MatCheckbox instance directly
(e.g. with @ViewChildren) would be the recommended approach.

(c) https://github.com/angular/material2/issues/13156#issuecomment-427193381

<section *ngFor="let item of list">
  <mat-checkbox [checked]="item.value" (change)="toggle($event)">{{item.key}}</mat-checkbox>
</section>