mercredi 30 novembre 2016

How to prevent the last checkbox from unchecking in angular 2

I have a problem with angular 2, I don't know how to check back the last checkbox after unchecking. Here is my piece of HTML:

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

And here my .ts code:

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
  }];

And:

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

I have no idea why this line: this.checkedBoxes[i].checked = true; doesn't work in my case.

Any help would be appreciated.




Aucun commentaire:

Enregistrer un commentaire