動的値でイオンオプションを設定する

Question

動的値（ion-option）で<ion-select >（ionic v2）を作成するにはどうすればよいですか？

以下に示すように、vaulesはjsonオブジェクトのトークンである必要があります。

{ 
    "direction":[ 
     { 
     "idd":"1", 
     "villedepart":"kasserine", 
     "villearrive":"sfax", 
     "ligne_direction":"kasserine sfax" 
     }, 
     { 
     "idd":"6", 
     "villedepart":"sousse", 
     "villearrive":"tunis", 
     "ligne_direction":"sousse tunis" 
     }, 
     { 
     "idd":"9", 
     "villedepart":"nabeul", 
     "villearrive":"sousse", 
     "ligne_direction":"nabeul sousse" 
     } 
    ], 
    "success":1 
} 

Answer 1

これは単に、ここで例えばvalues、あなたのJSONが変数に格納されたで行うことができます。そして、あなたはここでvilledepart、values.directionを反復処理し、必要どのプロパティを表示：イオン選択のための

<ion-item> 
    <ion-label>Values</ion-label> 
    <ion-select [(ngModel)]="selectedValue"> 
    <ion-option *ngFor="let val of values.direction">{{val.villedepart}}</ion-option> 
    </ion-select> 
</ion-item> 

Plunker

チェックthis linkを。

あなたはあなたのデータはあなたが直接値を反復処理することができることを意味し、応答から直接配列を抽出取得するときは、必要に応じことができます。

サービス：

getData() { 
    return this.http.get('url') 
    .map(res => res.json().direction) // this here! 
} 

コンポーネント：

this.myService.getData() 
    .subscribe(data => { 
    this.values = data; 
    }); 

このように繰り返します。

<ion-option *ngFor="let val of values">{{val.villedepart}}</ion-option>