帶下拉的Ionic2警報？

Question

我正在構建一個Ionic2應用程序。我有一個像下面的一個警告：

constructor(private platform: Platform, public nav : NavController, 
    public exhibitionSurveyObjectService : ExhibitionSurveyObjectService) { 

    this.initializeMap(); 
    this.nav=nav; 

    this.testArray=[]; 
    this.area=null; 
    } 

    addSurveyObject(){ 

    let prompt = Alert.create({ 
     title: 'Subscribe to our service', 
     message: "All the fields are necessary", 
     inputs: [ 
     { 
     name: 'name', 
     placeholder: 'Name' 
     }, 
     .... 
     { 
     name: 'cycle', 
     placeholder: 'Cycle: once/weekly/monthly' 
     }, 
     { 
     name: 'object_type', 
     placeholder: 'Farm/Solarpanel/plain' 
     }, 
     ], 
     buttons: [ 
     .... 
     { 
     text: 'Save', 
     handler: data => { 
      this.createExhibitionSuveyObject(data); 
     } 
     } 
     ] 
    }); 

    this.nav.present(prompt); 
    } 

    createExhibitionSuveyObject(data: any){ 

    var cycle = data.cycle; 
    cycle = cycle.toUpperCase() 
    console.log(cycle) 

    var type = data.object_type; 
    type = type.toUpperCase() 
    console.log(type) 

    this.exhibitionSurveyObjectService.addObject(
     data.name, data.farmer_email, 
     data.farmer_name, data.size, data.path, cycle, type).subscribe(

     response => { 

     this.exhibitionSurveyObjects = response; 
     this.sayThanks(); 

     }, 
     error => { 

     this.errorMessage = <any>error; 
     console.log("error") 
     } 
    ); 
    } 

    sayThanks(){ 

     let alert = Alert.create({ 
     title: 'Thank you!', 
     subTitle: 'We have received your data, we will get back to you soon!', 
     buttons: [{ 
      text: 'Ok', 
      handler:() => { 

      this.nav.push(HomePage) 
      } 
     }] 
     }); 
     this.nav.present(alert); 

    } 

我想最後兩個字段是下拉菜單。我怎樣才能做到這一點？

UPDATE：更新了代碼片段，並增加了一些代碼。如何更新以使用Modal而不是alert？

Answer 1

就像你可以在Ionic2 docs

警報看也可以包括幾個不同的輸入，其數據可以 傳回給應用程序。輸入可用作提示 用戶獲取信息的簡單方法。 收音機，複選框和文本輸入均爲 ，但不能混用。例如，警報可能有所有單選按鈕輸入或所有複選框輸入，但同一警報 不能混合無線電和複選框輸入。

而且......

如果你需要它不適合警報那麼我們建議構建形式 模式內，而不是 準則範圍內複雜的表單UI。

所以你必須創建一個新的Component與形式，然後用它來創建Modal：

import { Modal, NavController, NavParams } from 'ionic-angular'; 

@Component(...) 
class YourPage { 

constructor(nav: NavController) { 
    this.nav = nav; 
} 

presentSubscriptionModal() { 
    let subscriptionModal = Modal.create(Subscription, { yourParam: paramValue }); 
    this.nav.present(subscriptionModal); 
} 

} 

@Component(...) 
class Subscription{ 

constructor(params: NavParams) { 
    let param = params.get('yourParam'); 
} 

}