Angular 2使用ngFor设置和绑定复选框 [英] Angular 2 set and bind checkboxes with a ngFor

问题描述

我有一个像这样的数组：

I have an array like this:

 objectArray = [
        {"name": "Car"},
        {"name": "Bike"},
        {"name": "Boat"},
        {"name": "Plane"}
    ];

模板如下：

<li *ngFor="#obj of objectArray">
   <a href="#" class="small" data-value="option1" tabIndex="-1">
      <input type="checkbox" (change)="expression && expression.value = $event.target.checked ? true : undefind" [ngModel]="expression?.value">
      <label for="">{{ obj.name }}</label>
   </a>
</li>

但这在选中1个复选框时设置为true。我该如何分别设置？

But this is set true when 1 checkbox is checked. How do i set this separately ?

推荐答案

我想这就是您想要的：

<li *ngFor="let obj of objectArray">
   <a href="#" class="small" data-value="option1" tabIndex="-1">
<input type="checkbox"  
    (change)="expression && expression[obj.name]=$event.target.checked ? true : undefined"
    [ngModel]="expression && expression[obj.name]">
   </a>
</li>

更新
使用（ngModelChange ）通常优于（更改），尤其是如果使用 [ngModel]

update Using (ngModelChange) is usually better than (change) especially if [ngModel] is used

<input type="checkbox"  
    (ngModelChange)="expression && expression[obj.name]= $event ? true : undefined"
    [ngModel]="expression && expression[obj.name]">

这篇关于Angular 2使用ngFor设置和绑定复选框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！