Angular 4复选框触发模型更改时的更改事件

发布时间：2020-12-17 06:56:12 所属栏目：安全来源：网络整理

导读：HTML input type="checkbox" id="1" [(ngModel)]="filter" (change)="onFilterChange($event)" CheckBoxbutton (click)="filter = !filter"Change Status/button TS export class HelloWorld { filter : false; onFilterChange() { console.log('filter chan

HTML

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

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

export class HelloWorld {

  filter : false;

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

当我直接点击复选框时,会触发更改事件.但是当我点击“更改状态”按钮时,复选框状态正在改变,但更改事件未触发.有人可以让我知道怎么做吗？

解决方法

我们必须使用事件处理程序而不是2路绑定来实现此功能

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!