如何检查是复选框已检查angular2

Question

我想检查是否在if和else语句中选中或取消选中复选框.

<md-checkbox id="mon" (change)="mon($event)" [checked]="true">Checked</md-checkbox>



mon(e){
    if(e.target.checked){
      console.log("This is checked")
    } else {
      console.log("unchecked");
    }
  }

我想我做错了.我不断得到未定义的检查.怎么做到这一点？

Answer 1

我们可以查看材料的源代码复选框:

event.source = this;
event.checked = this.checked;

this._controlValueAccessorChangeFn(this.checked);
this.change.emit(event);

https://github.com/angular/material2/blob/2.0.0-alpha.11/src/lib/checkbox/checkbox.ts#L288-L292

所以你可以这样做:

mon(e){
  if(e.checked){
    console.log("This is checked")
  } else {
    console.log("unchecked");
  }
}

Answer 2

声明一个名为filter的变量

filter: boolean= false;

然后在html部分中使用ngModel来访问并分配其值.

<input type="checkbox" [(ngModel)]="filter" (click)="filterData()">

它将调用一个函数filterData(),您可以使用它来执行所有功能

filter(){
  this.filter = !this.filter;// this will change value of it true and false 
}

对于更多复选框,您可以使用声明更多变量,如filter1:boolean