Ionic 3 - ion-select 无法看到 select 选项的值

Question

我正在研究 select 选项菜单。我无法在下拉菜单中看到值 selection。我不知道我做错了什么。请通过以下代码一次

1. HTML

<ion-item id="fontBar" *ngIf="isAddTextSelected">
      <ion-label>Gender</ion-label>
      <ion-select [(ngModel)]="gender">
          <ion-option *ngFor="let employee of employees" [value]="employee"></ion-option>
      </ion-select>
    </ion-item>

2。 JS

this.employees = ["vishal", "poonam", "Asha", "Usha", "Sachin", "Rahul", "Mama", "Pravin", "Sehwag", "Rajendra", "Swara", "Ranu",
  "vishal", "poonam", "Asha", "Usha", "Sachin", "Rahul", "Mama", "Pravin", "Sehwag", "Rajendra", "Swara", "Ranu"];

我在构造函数中为 employees 变量添加了值。

注-：我已经在下面导入了 app.module.ts 甚至添加到所需的 ts 文件中。

import { FormsModule } from '@angular/forms';
imports: [
    BrowserModule,
    FormsModule,
    IonicModule.forRoot(MyApp, {
      scrollPadding: false,
      [![scrollAssist][1]][1]: true,
      autoFocusAssist: false

}),

3。输出-

Answer 1

你必须给选项一个内部值，像这样：

<ion-option [value]="group.id">
  {{ group.name }}
</ion-option>

Answer 2

select 组件采用子离子选项组件。如果没有给 ion-option 一个 value 属性，那么它将使用它的文本作为值。所以你可以通过两种方式解决这个问题：

1.Use 值：

<ion-select [(ngModel)]="gender">
 <ion-option *ngFor="let employee of employees" [value]="employee">
    {{employee}}
 </ion-option>
</ion-select>

2.Without 值：

<ion-select [(ngModel)]="gender">
 <ion-option *ngFor="let employee of employees">
    {{employee}}
 </ion-option>
</ion-select>

参考： https://ionicframework.com/docs/api/components/select/Select/

Ionic 3 - ion-select 无法看到 select 选项的值

Ionic 3 - ion-select not able to see values of select option

html

html-select

ionic3

ion-select

angular6