无法从 Ionic 中的离子选择中获取选定值答案

【问题标题】：Unable to get selected value from ion-select in Ionic无法从 Ionic 中的离子选择中获取选定值
【发布时间】：2019-06-13 22:59:40
【问题描述】：

我正在尝试从 ion-select 中获取选定的选项值
但是当我从 ion-select 中选择任何值时，我得到 Undefined 值，因为我是 ionic
我无法自行排序。

HTML：

<ion-item>
   <ion-label>Quantity</ion-label>
   <ion-select [(ngModel)]="number"  
     (ionChange)="onChange(carbrand)" >
      <ion-option *ngFor="let count of quantity" 
       [value]="count" >{{count}}</ion-option>
      </ion-select>
   <!-- <ion-select [(ngModel)]="number">
      <ion-option *ngFor="let count of quantity" 
      value="count"></ion-option>
   </ion-select> -->
</ion-item>

Home.ts：

onChange(SelectedValue){ 
  console.log("Selected Quantity", SelectedValue); 
}

【问题讨论】：

标签： angular typescript ionic-framework ionic2 ionic3

【解决方案1】：

您还可以使用其他两种方法。

1 - 将 $event 传递给您的函数：

HTML：

<ion-item>
    <ion-label>Quantity</ion-label>
    <ion-select [(ngModel)]="number" (ionChange)="onChange($event)" >
      <ion-option *ngFor="let count of quantity" value="count"></ion-option>
    </ion-select>
    <!-- <ion-select [(ngModel)]="number">
      <ion-option *ngFor="let count of quantity" value="count"></ion-option>
    </ion-select> -->
</ion-item>

Ts：

onChange(value){
  console.log(value);
}

2 - 在您的选择元素中使用 ID：

HTML：

<ion-item>
    <ion-label>Quantity</ion-label>
    <ion-select #S [(ngModel)]="number" (ionChange)="onChange(S.value)" >
      <ion-option *ngFor="let count of quantity" value="count"></ion-option>
    </ion-select>
    <!-- <ion-select [(ngModel)]="number">
      <ion-option *ngFor="let count of quantity" value="count"></ion-option>
    </ion-select> -->
</ion-item>

Ts：

onChange(value){
  console.log(value);
}

希望对你有帮助！

【讨论】：

在您的第一种方法中，[value]="count" 对我有用。

【解决方案2】：

那是因为 onChange 正在发送您可能未定义的 carbrand。您需要做的是使用您必须声明的类属性编号，如下所示：

onChange(){
    console.log("Selected Quantity", this.number); 
}

并删除 carbrand，除非它在模板中有值或作为类属性

【讨论】：