Ionic 2でActionSheetのオプションを動的に設定する

Question

GETリクエストを作成して、オプションの配列を含むJSONを取得し直しています。各要素の中に私はID、スタイル、名前を持っています。

応答に基づいて、私はIonic 2アプリケーションで自分のActionSheetのオプションを動的に設定したいと思います。

このActionシートは正常に動作します。私の挑戦は、APIの応答に基づいてオプションを動的に設定することです。

let actionSheet = this.actionSheetCtrl.create({ 
title: 'Change the tag of this visitor', 
buttons: [ 
    { 
    text: 'Destructive red', 
    cssClass: 'label-red', 
    handler:() => { 
     myFunction(1); 
    } 
    }, 
    { 
    text: 'Archive blue', 
    cssClass: 'label-dark-blue', 
    handler:() => { 
     myFunction(2); 
    } 
    }, 
    { 
    text: 'Cancel', 
    role: 'cancel', 
    handler:() => { 
     console.log('Cancel clicked'); 
    } 
    } 
] 
}); 

私はキャンセルオプションを保持していますが、上記の自分のオプションを表示したい、つまり破壊オプションとアーカイブオプションを削除します。 PHPで

私は、この擬似コードでこれを達成するであろう。..

$options = array(); 
$options['title'] = 'Change the tag of this visitor'; 

$buttons = array(); 

foreach($api_response as $a) { 
    array_push($buttons, array('text' => $a['name'], 'cssClass' => $a['style'])); 
} 

$options['buttons'] = $buttons; 

let actionSheet = this.actionSheetCtrl.create(json_encode($options)); 

そして、私の最後の質問は、私は私がのためのパラメータとしてを通じてループしています要素からIDの適切な値を指定する方法でありますmyFunction（）呼び出し...例えば、id = 1のときXXを1に、id = 20のときXXに設定する。

text: 'Name goes here', 
cssClass: 'label-red', 
handler:() => { 
    myFunction(XX); 
} 

Answer 1

私はこの問題を解決する良い方法を見つけたようです。私はaddButtonメソッドを使用しています。

let actionSheet = this.actionSheetCtrl.create({ 
    title: 'Change the tag of this visitor' 
});  

this.http.get('http://api.domain.com/tags', {headers:headers}).map(res => res.json()).subscribe(data => { 
    for (var i = 0; i < data.res.length; i++) { 
     actionSheet.addButton({text: data.res[i].name, cssClass: data.res[i].style });   
    } 
}); 

actionSheet.addButton({text: 'Cancel', 'role': 'cancel' });  

actionSheet.present();