如何在点击事件中使用 Ionic 的 RouterDirection？

Question

从一个页面路由到另一个页面时，首先使用的技术是routerLink + routerDirection。在第一段代码 (#1) 中，我们从一页转到下一页，方向为 forward。当我们想回到原来的页面时，在第二段代码（#2）中，我们必须在路由器的状态下传递数据。所以我们使用 click 事件来处理路由。

使用 点击事件 的第二个导航出现问题 (#2)。我们失去了触发 routerDirection 以使用 back 动画的能力。该页面正在向前移动（请参见下面的示例 #3）。

有没有办法通过 routerDirection + click 事件触发 back 动画？

Angular NavigationExtras 没有提供这个，因为我在这里查看了文档： https://angular.io/api/router/NavigationExtras

#1 |使用 routerLink

路由到页面

<ion-button fill="clear" routerLink="/chat-settings" routerDirection="forward">
  <ion-icon color="light" name="add-circle"></ion-icon>
</ion-button>

#2 |使用点击事件返回

<ion-button (click)="goToChat()" routerDirection="back"> <!-- routerDirection does nothing -->
  <ion-icon slot="icon-only" name="close"></ion-icon>
</ion-button>

goToChat() {
  this.router.navigateByUrl('/chat/' + this.chatID, {
    state: {
      // ...
    },
  });
}

#3 |直播设备

Answer 1

您可以使用 NavController 的 navigateBack() 函数实现此目的，该函数在 as you can see here 下使用 router.navigateByUrl()。您的 goToChat() 函数将如下所示：

goToChat() {
  this.navController.navigateBack('/chat/' + this.chatID, {
    state: {
      // ...
    },
  });
}

如何在点击事件中使用 Ionic 的 RouterDirection？

How to use Ionic's RouterDirection with a click event?

ionic-framework

angular

ionic4