Ionic 2 how to check all checkboxes on button clic

2019-09-19 02:11发布

问题:

I m fairly new in Angular 2 and hence Ionic 2, I have a little problem, can any body tell me how to check all checkboxes on button click?? and how to get value oc checked checkboxes on another button click.

Here is my how html looks like

<div class="card item-icon-right"  *ngFor="let item of items" >
    <ion-checkbox *ngIf="showCheckBoxes" [(ngModel)]="item.id" mode="ios"></ion-checkbox>
</div>
<button class="button button-calm">Check All</button>
<button class="button button-primary">Get selected Values</button>

Thanks

回答1:

you can have two checkbox elements

  1. For select All -to make all the elements based on one click(simply toggle)
  2. Select particular

    <div class="card item-icon-right"  *ngFor="let item of items" >
         <ion-checkbox *ngIf="showCheckBoxes && selectedAll" [(ngModel)]="item.id" mode="ios" [checked]="selectedAll"></ion-checkbox>
    
         <ion-checkbox *ngIf="showCheckBoxes && !selectedAll" [(ngModel)]="item.id" mode="ios" ></ion-checkbox>
    </div>
    

    Check All Get selected Values

    checkAll(){
        this.selectedAll=true;
        console.log(this.items);
    }
    

When you are selecting all items then you are using the entire array as such.