如何工作2选择动力学离子3

Question

有人可以教我如何使用两个动态选择？例如，我首先选择州，然后在第二选择中显示城市。我如何在Ionic 3中做到这一点？

Answer 1

在你.html：

<ion-item> 
    <ion-label>State</ion-label> 
    <ion-select [(ngModel)]="selected_state" (ionChange)="stateSelect(selected_state)"> 
     <ion-option *ngFor="let item of states" value="{{item.name}}">{{item.name}}</ion-option> 
    </ion-select> 
</ion-item> 

<ion-item> 
    <ion-label>City</ion-label> 
    <ion-select [(ngModel)]="selected_city"> 
     <ion-option *ngFor="let item of cities" value="{{item.name}}">{{item.name}}</ion-option> 
    </ion-select> 
</ion-item> 

，并在您.ts

states = [ 
{ 
    name: 'state1' 
}, 
{ 
    name: 'state2' 
} 
]; 
main_cities = [ 
{ 
    name: 'city1', 
    state: 'state1' 
}, 
{ 
    name: 'city2', 
    state: 'state1' 
}, 
{ 
    name: 'city3', 
    state: 'state2' 
}, 
{ 
    name: 'city4', 
    state: 'state2' 
} 
]; 
cities=[]; 
selected_state; 
selected_city; 

public stateSelect(selected_state) { 
this.cities=[]; 
for (let city of this.main_cities) { 
    if (selected_state == city.state) { 
    this.cities.push(city); 
    } 
} 
}