Question

我有一个离子警报组件，消息为“致我自己”和“致某人”。这两个按钮应该像按钮一样操作，并路由到应用程序中的不同页面。但是（单击）和[routerLink]或在message属性上调用route.navigate均无效。有什么建议吗？

它基本上将其作为字符串使用，并且不响应（单击）事件。我也尝试过给route.navigate，没有运气。

async transferMoneyTo() {
        const alert = await this.alertController.create({
            header: "Send Money",

            message: `<p (click)="console.log("Clicked") class="dib" style="text-decoration:none;color:#333333; margin:1em;font-size: 1.1em;">To Myself</p>               
                  <p (click)="console.log("test"); toSomeone()" style="text-decoration:none;color:#333333;font-size: 1.1em;">To Someone</p>`,

            buttons: [
                {
                        text: "Cancel",
                    role: "cancel",

                },
                {
                    text: "OK",
                },
            ],

            cssClass: "alertbox-custom",
        });

        await alert.present();
    }

当我点击“ To Someone”时，它应该执行一个操作。

Answer 1

建议在ion-alert的内置button属性中使用处理程序。它应该看起来像这样：

async presentAlertConfirm() {
    const alert = await this.alertController.create({
      header: 'Send Money',
      message: 'Where would you like to send your money?',
      buttons: [
        {
          text: 'Cancel',
          role: 'cancel',
          cssClass: 'secondary',
          handler: () => {
            console.log('User cancelled');
          }
        }, {
          text: 'To Myself',
          handler: () => {
            toMyself();
          }
        },
        {
          text: 'To Someone',
          handler: () => {
            toSomeone();
          }
        }
      ]
    });

    await alert.present();
  }

如果这不符合您的需求，那么您应该根据文档建立自己的自定义模式来处理此问题

如果您需要一个复杂的表单UI，该UI不适合警报的准则，那么我们建议您在模态代替。

View the documentation here

如何使Ionic V4 Alertbox消息应路由到其他页面

1 个答案: