离子 2:为什么更改事件不适用于离子选择

Question

为什么更改事件不适用于离子选择？

我尝试使用以下语句：

<ion-select formControlName="shippingMethod (change)="shippingMethodChange($event)">

我还使用以下方法尝试了ionChange，这正在工作：

<ion-select formControlName="shippingMethod (ionChange)="shippingMethodChange($event)">

据说"我们可以使用 Angular 事件绑定来响应任何 DOM 事件"，这是更改事件的文档

https://developer.mozilla.org/en-US/docs/Web/Events/change

Answer 1

您可以通过以下方式使用它：

  <ion-select [(ngModel)]="gender" (ionChange)="onSelectChange($event)">
    <ion-option value="G">Colombo</ion-option>
    <ion-option value="M">Galle</ion-option>
  </ion-select>

然后在您的 .ts 文件中：

  onSelectChange(selectedValue: any) {
    console.log('Selected', selectedValue);
  }

Answer 2

ion-select是Ionic 2的自定义组件。在此处查看 api。它是通过离子利用基于开发人员要求的alertController/actionsheetcontroller构建的。

它不像 HTML 选择那样使用更改事件，并且发出的正确事件是 ionChange 。

编辑并且单击ion-option发出的事件是 ionSelect .

检查此 github 问题。

组件文档在这里

希望这能回答你的问题。

Answer 3

这个问题时不时地出现。根据文档 ionSelect 是选项（ion-option）上的输出事件

下面是一个用法示例

<ion-select>
  <ion-option *ngFor="let opt of options" [value] = "opt" (ionSelect)="triggerMe(opt)">{{opt}}</ion-option>
</ion-select>

然后

triggerMe(value: string): void {
  console.log("selected value", value);
}