如何使 ionic v4 alertbox 消息应该路由到其他页面

Question

我有一个离子警报组件，其中包含“给我自己”和“给某人”的消息。这两个应该像按钮一样工作并路由到应用程序中的不同页面。但是（单击）和 [routerLink] 或在消息属性上调用 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();
    }

只要我点击“给某人”这个文本，它就会执行一个动作。

Answer 1

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

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 警报指南，那么我们建议在 而是模态的。

View the documentation here