IONIC中的连续确认警报

时间:2017-07-31 23:55:10

标签: ionic-framework ionic3

我试图从一个接一个的用户那里得到两个确认。如果第一个被取消,则无需获得第二个。但如果第一个达成一致,则应显示和处理第二个。我正在使用像这样的代码

showConfirmation1() {
  let confirm = this.alertCtrl.create({
    title: 'C1',
    message: "M1",
    buttons: [
      {
        text: 'No',
      },
      {
        text: 'Yes',
        handler: data => {
          this.showConfirmation2(); 
        }
      }
    ]
  });

showConfirmation2() {
  let confirm = this.alertCtrl.create({
    title: 'C2',
    message: "M2",
    buttons: [
      {
        text: 'No',
      },
      {
        text: 'Yes',
        handler: data => {
          this.doYourJob(); 
        }
      }
    ]
  });

如果用户取消第一个,一切正常。如果用户接受第一个,则正确显示第二个。然而,第二个有点冻结。它的No按钮和Yes按钮都不起作用。当您点击页面的其他区域时,它甚至不会消失。

1 个答案:

答案 0 :(得分:1)

<强>更新
找到一种更清洁的解决方案,需要更少的代码并且更容易理解 通过在按钮false中返回handler,可以阻止警报关闭。并且dismiss - 函数返回一个Promise,在转换完成后会得到解析。所以我们将调用该函数来打开第二个警报。

showConfirmation1() {
    let confirm = this.alertCtrl.create({
        title: 'C1',
        message: "M1",
        buttons: [
            {
                text: 'No',
            },
            {
                text: 'Yes',
                handler: data => {
                    confirm.dismiss()
                    .then(() => {
                        this.showConfirmation2();
                    });

                    return false;
                }
            }
        ]
    });

    confirm.present();
}

<强> ORIGINAL:

在第一次提醒时使用dismiss(data:any)功能。并传递一个值,表明它没有被取消。在onDidDismiss - 函数中检查此值。如果它出现第二个警报。

showConfirmation1() {
    let confirm = this.alertCtrl.create({
        title: 'C1',
        message: "M1",
        buttons: [
            {
                text: 'No',
            },
            {
                text: 'Yes',
                handler: data => {
                    confirm.dismiss({ showSecond: true });
                    return false;
                }
            }
        ]
    });

    confirm.onDidDismiss(data => {
        if(data && data.showSecond){
            this.showConfirmation2();
        }
    }

    confirm.present();
}