angular - 在 Angular 应用程序中将导航相关代码放在哪里？

Question

目前我在我的 AuthGuard 构造函数中订阅了下面的 redux 状态更改。它只会重定向到登录后请求的原始页面。这不是正确的地方，但我不知道它应该在哪里：

auth.guard.ts：

this.subscription = this.ngRedux.select<ILoginState>('login')
  .subscribe(newState => {
    if (newState.isLoggedIn) {
        let redirectUrl : string = ngRedux.getState().window.windowData.redirectUrl;
        if (!redirectUrl) {
          redirectUrl = '/map/' + this.tabService.sessionId;
        }
        this.router.navigate([redirectUrl]);
      }
  });

我还有其他与导航相关的东西，如下所示。这目前在一个服务中，应该管理不同的浏览器窗口并在它们之间进行状态同步：

/* track url changes and change redux state */
this.router.events.subscribe((event) => {
  if (event instanceof NavigationEnd) {   
    this.ngRedux.dispatch(this.windowActions.setOutletActiveRoute(event.urlAfterRedirects));
  }
});

两者都可以在核心或 app.component.ts 中的新 navigation-service.ts 中。我读了一篇关于不订阅角度服务的文章，所以可能不是服务。将所有内容都放在 app.component 中听起来是个坏主意。我想把所有与导航相关的东西放到它自己的地方来分开关注点。推荐的方式是什么？

Answer 1

Create a app.navigator.ts file and put your navigation logic there, this is not a service or component just a ts file.

app.navigator.ts

......


/* track url changes and change redux state */
this.router.events.subscribe((event) => {
  if (event instanceof NavigationEnd) {   
    this.ngRedux.dispatch(this.windowActions.setOutletActiveRoute(event.urlAfterRedirects));
  }
});

......