如何获取导航历史记录?

sta*_*ler 6 javascript angular angular7

我正在尝试实现一个菜单,其中包括 Angular 应用程序中最近访问过和最常访问的页面。如何获取导航堆栈?或者我是否需要挂钩navigationStart事件并在创建时对其进行编译?

Mik*_*123 3

我认为不可能通过简单的方法调用来获取完整的历史记录,但您可以通过订阅 NavigationEnd 来轻松地自行跟踪。

previousUrl: string;
constructor(router: Router) {
  router.events
  .filter(event => event instanceof NavigationEnd)
  .subscribe(e => {
    console.log('prev:', this.previousUrl);
    this.previousUrl = e.url;
  });
}
Run Code Online (Sandbox Code Playgroud)

在此示例中,它仅保存以前的路线,但您可以存储在数组中以保存所有以前访问过的路线。

另请参阅: 如何在 Angular 中确定上一页 URL?

更新:

您可以将上面的代码与下面的代码结合使用,从应用程序启动时订阅您服务中的 NavigationEnd。

export class AppModule {
constructor(navigationEndService: NavigationEndService) {
    navigationEndService.init();
}
Run Code Online (Sandbox Code Playgroud)

要在其他地方获取列表,您可以在服务中创建一个 getter。