如何添加值，以选择组件，并获得选择在Appery离子应用程序

Question

我想以编程方式列出类型选择组件中的3个选项，并获得离子应用程序中选定的选项值。

Answer 1

下面是步骤，你可以怎么做：

• 下降Select组件到页面
• 点击Option子组件上的组件，在属性面板组：
  • ng-model到viewData.gender和
  • ng-options到gender.id as gender.name for gender in viewData.genderOptions
在 init功能的页面设置
• $scope.viewData = { gender: 0, genderOptions: [ {id:0, name:'Male'}, {id:1, name:'Female'}], };

Answer 2

<ion-list> 
    <ion-item> 
     <ion-label>Countries</ion-label> 
     <ion-select [(ngModel)]="selectedCountry" (ngModelChange)="onSelect()"> 
     <ion-option *ngFor="let item of countries" [value]="item.id">{{ item.value }}</ion-option> 
    </ion-select> 
    </ion-item> 
</ion-list> 

countries是你要绑定到离子选择列表

public countries: Array<{ id: number, value: string }> = [ 
    { id: 1, value: 'AUS' }, 
    { id: 2, value: 'IND' }, 
    { id: 3, value: 'UK' }, 
    ]; 

“SELECTEDCOUNTRY”是最初选定的值，在这种情况下，国家与指数1阵列国家

public selectedCountry: any; 
this.selectedCountry = this.countries[1].id; 

您可以使用javascript Array.push动态地将价值添加到国家/地区

this.countries.push({ id: 4, value: 'USA' }); 

可以在SELECTEDCOUNTRY

得到使用事件 (ngModelChange)="onSelect()"变化值

public onSelect(): void { 
    console.log(this.selectedCountry); 
}