离子 2 多选与全选复选框

Question

我想提供带有ion-select 的选择选项。我在第一个位置手动添加了全选选项，当我全选视图未更新时。如何更新视图？

.html

<ion-select multiple="true">
      <ion-option (ionSelect)="allClicked()">select all</ion-option>
      <ion-option *ngFor="let item of students ; let i = index" [selected]="item.checked" [value]="item">{{item.studentName}}</ion-option>
</ion-select>

.ts

       allClicked(){
        if(this.isAll){
           console.log(this.isAll)
            this.isAll = false;
            for (let temp of this.students) {
             temp.checked = false;
               }
        }else{
        this.isAll = true;

        for (let temp of this.students) {
           temp.checked = true;
           }
          }
        console.log("all select event ");
        }

Answer 1

一种解决方案是将所有学生放入模型中进行离子选择

<ion-select multiple="true" [(ngModel)]="selectStudents">
      <ion-option (ionSelect)="allClicked()">select all</ion-option>
      <ion-option *ngFor="let item of students ; let i = index" [selected]="item.checked" [value]="item">{{item.studentName}}</ion-option>
</ion-select>

ts。

selectStudents:[];
function allClicked(){
    selectStudents=[];
    students.filter((data)=>{
       this.selectStudents.push(data.studentName);
    });
}

我假设学生是一群学生。