如何防止最后一个选中复选框取消选中角度2

时间:2016-11-30 10:02:14

标签: javascript html angular checkbox

我有角度2的问题,我不知道如何在取消选中后检查最后一个复选框。 这是我的HTML:

<td *ngFor="let box of checkedBoxes"><input
    type="checkbox"
    value="{{box.name}}"
    id="{{box.name}}"
    [(ngModel)]="box.checked"
    (ngModelChange)="updateGroupByCheckboxes($event, box.name)">
    <label>{{box.label}}</label>
</td>

这是我的.ts代码:

checkedBoxes: any[] = [{
    "name": "box1",
    "label": "Box1",
    "checked": true
  },
  {
    "name": "box2",
    "label": "Box2",
    "checked": false
  },
  {
    "name": "box3",
    "label": "Box3",
    "checked": false
  },
  {
    "name": "box4",
    "label": "Box4",
    "checked": false
  }];

并且:

updateGroupByCheckboxes(event, name) {

    var counter = 0;
    for(var i = 0; i < this.checkedBoxes.length && counter <= 1; i++) {
      if(counter > 1) {
        break;
      }

      if(this.checkedBoxes[i].checked) {
        counter++;
      }
    }

    if(counter < 1 && event == false) {
      for(var i = 0; i < this.checkedBoxes.length; i++) {
        if(this.checkedBoxes[i].name == name) {
          console.log("val: " + this.checkedBoxes[i].checked);
          this.checkedBoxes[i].checked = true;
          break;
        }
      }
    }
    else {
      this.checkedBoxes[3].checked = !this.checkedBoxes[3].checked;
      var grouppingData = [];
      for(var i = 0; i < this.checkedBoxes.length; i++) {
        if(this.checkedBoxes[i].checked == true){
          grouppingData.push(this.checkedBoxes[i].name);
        }
      }
      this.statistics = this.statisticsService.getStatistics(grouppingData);
    }
}

我不知道为什么这一行:this.checkedBoxes[i].checked = true;在我的情况下不起作用。

任何帮助都将不胜感激。

0 个答案:

没有答案