mercredi 28 novembre 2018

Angular 4 select all checkboxes

i am trying to implement select all checkbox which will select all the checkboxes which is fine but when i click on other checkboxes other than select all it will again select all checkboxes

Html file

<div class="form-check mt-3">
      <label class="form-check-label text-dark font-weight-bold">
        <input class="form-check-input" type="checkbox" value="" [(ngModel)]="selectedAll" [ngModelOptions]="{standalone:

true}" (change)="selectAll()"> Select All

    <div  *ngFor="let a of name">

    <div class="d-flex justify-content-between">

      <!--------------------div to justify content --------------------->
      <div class="">

        <div class="form-check mt-3">
          <label class="form-check-label text-dark">
            <input class="form-check-input" type="checkbox" value="" [(ngModel)]="a.selected" [ngModelOptions]="{standalone:

true}" (change)="checkIfAllSelected()"> Household Information

        <div class="form-check mt-3">
          <label class="form-check-label text-dark">
            <input class="form-check-input" type="checkbox" value="" [(ngModel)]="a.selected" [ngModelOptions]="{standalone:

true}" (change)="checkIfAllSelected()"> House Images

        <div class="form-check mt-3" >
          <label class="form-check-label text-dark">
            <input class="form-check-input" type="checkbox" value="" [(ngModel)]="a.selected" [ngModelOptions]="{standalone:

true}" (change)="checkIfAllSelected()"> Map Access

Ts file

selectAll() {
for (let i = 0; i < this.name.length; i++) {
  {
    this.name[i].selected = this.selectedAll;
  }
}

}

checkIfAllSelected() {

console.log(this.name);

this.selectedAll = this.name.every(function (item: any) {
  console.log(item);
  return item.selected == true;
})

}




Aucun commentaire:

Enregistrer un commentaire