angular - 如何从 Ionic 4 中的 ionic 选择选项中获取选择事件？

Question

我需要为 Ionic 4 选择列表实现“全选”选项。但是，我没有找到从 ion-select-option 或 ion-select 触发(点击)或类似事件的方法。有什么建议么？请注意，Ionic 3 的解决方案不一定适用于 v4。

<ion-item>
  <ion-label>Header</ion-label>
  <ion-select [(ngModel)]="items" multiple okText="OK" cancelText="Cancel">
    <ion-select-option value="all">Select all</ion-select-option>
    <ion-select-option *ngFor="let item of items" [value]="item.id">{{ item.name }}</ion-select-option>
  </ion-select>
</ion-item>

Answer 1

像这样尝试:

Working Demo

.ts

  items;

  constructor() {
    this.options.unshift({
      id: -1,
      name: `Select All`
    });
  }

  onChange(evt) {
    if (evt == -1) {
      this.items = this.options.map(x => x.id);
    } else {
      let selectAllIndex = this.items.indexOf(-1);
      this.items.splice(selectAllIndex, 1);
    }
  }

.html

    <ion-select [(ngModel)]="items" multiple okText="OK" cancelText="Cancel" (ngModelChange)="onChange($event)">
        <ion-option *ngFor="let item of options" [value]="item.id">
            {{ item.name }}
        </ion-option>
    </ion-select>