【问题标题】:How to know which all checkboxes checked using angular2?如何知道使用 angular2 检查了哪些所有复选框?
【发布时间】:2017-08-17 21:41:10
【问题描述】:

我目前正在使用 angular2。我有我的 HTML 代码,比如

<div *ngFor="let val of channelForTabs; let i=index">
            <label for="isCheckBox" style="margin-left:15px;">Draw</label>
            <input id="checkBox{{i}}" type="checkbox" class="fitCheckbox" style="margin-left: 10px;width: 16px;" />
            <de-series-prop></de-series-prop>
        </div>

channelForTabs 中的值的多次,这些多次复选框和系列组件被添加。如何在不调用(更改)方法的情况下检查所有复选框被选中。

我想知道在一个按钮上单击如何查看哪些复选框被选中并使用那些相应的系列数据。

【问题讨论】:

  • 类似的问题有几十个。在发布新问题之前,请尝试查找现有问题。

标签: angular typescript


【解决方案1】:

您应该使用 ngModel 和 ngModelChange 事件,如下所示,

<input type="checkbox" (ngModelChange)="clickedItem(color, $event)" checked="false" [ngModel]="!color"> {{color}}<br>

你的方法将是

 clickedItem(val,event){
    if(event){
    this.selectedItems.push(val);
    }
    console.log(val);
  }

LIVE DEMO

【讨论】:

  • 我有你@Aravind
  • @krummens 您需要更多帮助吗?
  • 不。不过感谢您的回答。
  • 它不会删除取消选中的元素。
  • 我可能没有添加 else 语句 @adrita sharma
【解决方案2】:

这会起作用,但如果用户取消选中某个选项,则该值将保留在数组中。每次不勾选都要拼接。

let indexx = this. selectedItems.indexOf(element.value); this. selectedItems.splice(indexx, 1);

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-04-20
    • 2020-09-18
    • 1970-01-01
    • 2011-10-27
    • 2012-04-25
    • 2013-03-24
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多