Ionic 2添加单选按钮以提醒控制器

时间:2017-05-20 13:19:14

标签: ionic2 radio-button

如何在离子2的警报控制器中添加单选按钮作为输入按钮? 它适用于复选框,但我想添加单选按钮组和单选按钮,只选择一个选项。

  advanceSearch(): void{
   let prompt = this.alertCtrl.create({
    title: 'something',
    message: 'Select option ',
    inputs : [
     {
       type:'checkbox',
       label:'something1'
     },
     {
       type:'checkbox',
       label:'something2'
      }

    ],
    buttons : [
     {
       text: "Cancel",
       handler: data => {
         console.log("cancel clicked");
       }
     },
     {
       text: "Search",
       handler: data => {
         console.log("search clicked");
       }
     }
    ]
    });
    prompt.present();
}

`

我想将这些复选框更改为单选框。

2 个答案:

答案 0 :(得分:19)

试试这个。

advanceSearch(): void
{
    let prompt = this.alertCtrl.create({
    title: 'something',
    message: 'Select option ',
    inputs : [
    {
        type:'radio',
        label:'something1',
        value:'something1'
    },
    {
        type:'radio',
        label:'something2',
        value:'something2'
    }],
    buttons : [
    {
        text: "Cancel",
        handler: data => {
        console.log("cancel clicked");
        }
    },
    {
        text: "Search",
        handler: data => {
        console.log("search clicked");
        }
    }]});
    prompt.present();
}

答案 1 :(得分:0)

请注意,cuttenly AlertController.create 方法返回 Promise<HTMLIonAlertElement>,因此您必须使用 async / await 创建它:

async advanceSearch(): void
{
  let prompt = await this.alertCtrl.create({
    title: 'something',
    message: 'Select option ',
    inputs : [
    {
        type:'radio',
        label:'something1',
        value:'something1'
    },
    {
        type:'radio',
        label:'something2',
        value:'something2'
    }],
    buttons : [
    {
        text: "Cancel",
        handler: data => {
        console.log("cancel clicked");
        }
    },
    {
        text: "Search",
        handler: data => {
        console.log("search clicked");
        }
    }]});

   await prompt.present();
}