Angular2 - 带有多个复选框的 NgFor

Question

我正在尝试创建一个表，其中包含多个具有不同状态的复选框（有些是真的，有些是假的）。

在此表中，我有“保存”按钮来使用他的状态来填充所有元素。

代码如下：

<form #form="ngForm" (ngSubmit)="save(form)">
  <table datatable [dtOptions]="dtOptions" [dtTrigger]="dtTrigger"
         class="table table-hover table-bordered table-striped">
    <thead>
      <tr>
        <th>{{'name-placeholder' | translate}}</th>
        <th>{{'action' | translate}}</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let card of cardsDashboard;let i=index">
        <td>{{card.text}}</td>
        <td>
          <div class="form-check">
            <label>
              <input type="checkbox" name="checkDashboard" [(ngModel)]="card[i]"
                     (ngModelChange)="card[i].activate==true?'true':'false'" [checked]="card.activate">
              <span class="label-text"></span>
            </label>
          </div>
        </td>
      </tr>
    </tbody>
  </table>
  <div class="btn-toolbar pull-right ">
    <div class="btn-group">
      <button class="btn btn-primary">{{'save' | translate}}</button>
    </div>
  </div>
</form>

第一个问题：“保存”按钮不会更新元素的状态。

第二个问题：复选框不显示默认状态。复选框为空。

所以问题是：我怎样才能用复选框做一个 ngfor 并显示状态并更新它？

----更新：数组-----

0:
activate: true
cardType: 1
id: 1
text: "Contadores"
__proto__: Object
1: {id: 2, text: "Alarmas", cardType: 2, activate: false}
2: {id: 3, text: "Consumo día anterior", cardType: 3, activate: false}
3: {id: 4, text: "Consumo del mes anterior", cardType: 4, activate: false}
4: {id: 5, text: "Elementos instalados la ultima semana", cardType: 5, activate: false}
5: {id: 6, text: "Elementos que han comunicado hoy", cardType: 6, activate: false}

Answer 1

更新我觉得有点傻 ::glups::

[(ngModel)]="card[i].activate" //<--WRONG

[(ngModel)]="card.activate" //<--OK

忘记（ngModelChange）和[检查]。

看问题，你真的什么都没做

通常，我们可以做两件事：

数组中的值，例如values=["uno","tres"] 或 values=[true,false,true,false] “已检查选项”的列表=[“uno”，“dos”，“tres”，“cuatro”]

所以，我们可以在一个数组中拥有

this.options.forEach((x,index)=>{
   this.card[index].activate=value[index]
   //or 
   //   this.card[index].activate=value.indexOf(x)>=0

})