Angular6 当我尝试根据用户角色使用角度保护进行路由时，浏览器冻结

我刚开始使用angular6，目前在使用angular提供的guard根据用户角色路由到不同页面时遇到问题。我在应用程序中有3个主要角色

这是我的AuthGard auth.guard.ts

export class AuthGuard implements CanActivate {
constructor(private auth: AuthService,
    private router: Router) { }
canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | 
boolean {
console.log(this.auth.isLoggedIn())
if (this.auth.isLoggedIn()) {
  return true;
}  

this.router.navigate(['/login'], { queryParams: { returnUrl: state.url } })
return false;
}
}

---

我缺少什么？

在使用angular 6及更高版本时，请确保不要将它们包含在providers app.module.ts中，因为服务已在“root”中提供。 例：

@可注入({
providedIn:'根'
})

export class RoleGuard implements CanActivate {
  constructor(private _auth: AuthService, private _router: Router) { }

canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
switch (this._auth.getRole()) {
  case "STUDENT":
    this._router.navigate(['/']);
    return true;
  case "DEPARTMENT":
    this._router.navigate(['/department']);
    return true;
  case "FACULTY":
    this._router.navigate(['/faculty']);
    return true;
  default:
    return false;
   }
  }
}

{ path: '', component: DashboardComponent, canActivate: [AuthGuard, RoleGuard] },
  { path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard, RoleGuard] }