Angular 4 case à cocher déclencher un événement de changement lors du changement de modèle

Question

HTML

<input type="checkbox" id="1" [(ngModel)]="filter" (change)="onFilterChange($event)"> CheckBox

<button (click)="filter = !filter">Change Status</button>

TS

export class HelloWorld {

  filter : false;

  onFilterChange() {
    console.log('filter change called');
  }
}

Lorsque je clique directement sur la case à cocher, l'événement de changement est déclenché. Mais lorsque je clique sur le bouton "Modifier l'état", l'état de la case à cocher change mais l'événement de changement ne se déclenche pas. Quelqu'un peut-il me faire savoir s'il vous plaît comment faire cela?

Answer 1

Nous devons obtenir cette fonctionnalité avec un gestionnaire d'événements et non avec une liaison bidirectionnelle.

<input type="checkbox" id="1"
       [ngModel]="filter" (ngModelChange)="onFilterChange($event)"> Checkbox

<button (click)="onFilterChange($event)">Change Status</button>  

et en TS,

export class HelloWorld {

  filter = false;

  onFilterChange(eve: any) {
    this.filter = !this.filter;
  }
}