【问题标题】:How to check is checkbox is checked angular2如何检查复选框是否已检查 angular2
【发布时间】:2016-12-20 13:18:35
【问题描述】:

我想检查 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");
    }
  }

我觉得我做错了。我一直无法检查未定义。这样做的方法是什么?

【问题讨论】:

    标签: angular


    【解决方案1】:

    声明一个变量,称为过滤器

    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

    【讨论】:

    • 这是针对当用户选中您的复选框或取消选中您的复选框时您想要做某事的情况
    • 这对我有用。如果选中复选框,则过滤变量为真,否则为假。谢谢 - @Amit Kumar
    【解决方案2】:

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

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

    【讨论】:

    • 哦,是的,这个 angular2 的东西 :)
    • 我们可以为 使用相同的吗?
    • @TusharKukreti 有什么问题?你自己试过吗?
    • 是的,我试过了,对于&lt;input type="checkbox"&gt;,我们需要使用e.target.checked
    • @TusharKukreti 是的,我们应该使用 e.target.checked 作为原生复选框
    猜你喜欢
    • 2018-09-23
    • 2016-04-22
    • 2015-11-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-08-31
    • 2023-04-05
    相关资源
    最近更新 更多