Angular 4复选框在模型更改时触发更改事件 [英] Angular 4 checkbox trigger change event on model change

问题描述

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');
  }
}

当我直接单击复选框时，将触发更改事件.但是，当我单击更改状态"按钮时，复选框状态正在更改，但更改事件未触发.有人可以让我知道怎么做吗?

When I directly click on the check box change event is triggered. But when I click on "Change Status" button checkbox status is changing but change event is not triggering. Can some one please let me know how to do this?

推荐答案

我们必须使用事件处理程序而非2种方式绑定来实现此功能

We have to achieve this functionality with event handler and not with 2 way binding

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

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

在TS中，

export class HelloWorld {

  filter = false;

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

这篇关于Angular 4复选框在模型更改时触发更改事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！