我正在尝试使用单独的网页单独的警卫。我基本上检查一个布尔参数，以了解是否有一个用户登录或没有。
这是我的两个密码

export class IsAuthenticatedGuard implements CanActivate {
  constructor(private authService: AuthService, private router: Router){}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
    return this.authService.isLoggedIn$.pipe(
      tap(isLoggedIn => {
        if(!isLoggedIn){
          //redirect
          this.router.navigate(['login']);
        }
      })
    );
  }
}

export class LoginPageGuard implements CanActivate {
  constructor(private authService: AuthService, private router: Router){}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
    return this.authService.isLoggedIn$.pipe(
      tap(isLoggedIn => {
        if(isLoggedIn){
          //redirect
          this.router.navigate(['overview-page']);
        }
      })
    );
  }
}

这是我使用guards的代码（app. module. ts）我删除了overview-page和login之间的页面，因为它们不相关。

HttpClientModule,
    RouterModule.forRoot([
      //{path: '', component: UserTargetsComponent },
      //{path: '', component: NavbarComponent },
      {path: '', component: OverviewPageComponent, canActivate: [IsAuthenticatedGuard]},
      {path: 'overview-page', component: OverviewPageComponent, canActivate:[IsAuthenticatedGuard]},
      {path: 'login', component: LoginComponent, canActivate: [LoginPageGuard]},
      {path: '**', component: NotFoundComponent, canActivate: [IsAuthenticatedGuard]}
    ])

在很短的一段时间内，它的工作正如我所期望的。如果用户登录它不允许去登录页面，引导您到概述页面，如果用户没有登录，反之亦然。
现在它只是没有React。只是去主页（localhost：xxx/）当我去登录页面输入浏览器栏。同样的概述页。经过几次尝试，页面通常崩溃，所以我重新启动角应用程序。
如果我停止使用登录页面上的canActivate，一切正常。当我把它再次打破。我猜这是不知何故造成这个问题，但如何？
有什么想法吗？也许我漏掉了什么小东西。