如何通过点击事件使用 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: {
      // ...
    },
  });
}