typescript - 在 Angular TS 的 web 应用中为不同类型的用户导航路由

我想在我的网页应用中，当我以普通用户登录和以管理员登录时显示不同的页面。我已经创建了一个 authservice，从我的用户对象中获取 isAdmin 的值，并且我还有一个方法可以从 auth.service.ts 获取......我应该在 login.component.ts 中添加什么来获取 isAdmin 参数？现在我的控制台显示:

 undefined                   auth.service.ts:41 
 [token.value...]            auth.service.ts:78
 false                       auth.service.ts:85
 true                        login.component.ts:51

似乎它不会等待获取 isAdmin 的值，无论我以用户还是管理员身份登录时，它总是直接进入管理员页面。在我的 login.component.ts 中我应该添加什么？

//auth.service.ts
getIsAuth() {
return  this.isAuthenticated;
}

getUserAdmin(){
console.log(this.isAdmin);
return this.isAdmin;
}


// auth.guard.ts
canActivate(
  route: ActivatedRouteSnapshot,
  state: RouterStateSnapshot
): boolean | Observable<boolean> | Promise<boolean> {
  const isAuth = this.authService.getIsAuth();
  const isAdmin= this.authService.getUserAdmin();
  if (!isAuth) {
    this.router.navigate(['observatory/api/login']);
  }
    else{
    if (!isAdmin){
      this.router.navigate(['observatory/api/user']);
    }
    else if (isAdmin){
      this.router.navigate(['observatory/api/admin']);
    }
  }
  return isAuth;

}

 //login.component.ts
onSubmit() {
    this.submitted = true;


    if (this.loginForm.invalid) {
        return;
    }
    this.authService.login(this.f.username.value, this.f.password.value);
    this.loading = true;
    this.isAdmin= this.authService.getUserAdmin();
    this.authListenerSubs = this.authService
      .getAuthStatusListener()
      .subscribe(async isAdmin => {
           this.isAdmin= await isAdmin;
        console.log(this.isAdmin);
        if (!this.isAdmin){
            this.router.navigate(['/user']);
          }
        else{
            this.router.navigate(['/admin']);
          }
      }); 


 //auth.service.ts: fuction-login
 login( username: string,  password: string) {
var user: User = {  username: username, password: password };
this.http
  .post<any>("http://localhost:3000/api/auth",user, {observe:'response'})
  .subscribe((res) => {
    const token = res.headers.get('X-OBSERVATORY-AUTH');
    console.log(token);
    this.token = token;
    if (token!==null) {
      this.isAuthenticated = true;
      this.userId = res.body._id;
      this.isAdmin=res.body.isAdmin;
      this.userAdmin=res.body.isAdmin;
      console.log(this.userAdmin);
      this.username=res.body.username;
      this.authStatusListener.next(true);
      this.saveAuthData(token, this.userId,this.username, this.isAdmin); 
    }
  });

  getUserAdmin(){
console.log(this.userAdmin);
return this.userAdmin;

}

  //app-routing.ts
   const appRoutes: Routes = [
  { path: 'observatory/api/login', component: LoginComponent},
  { path: 'observatory/api/register', component: RegisterComponent },
  {path: 'observatory/api/logout', component:LogoutComponent},
{path: 'observatory/api', component: HomeComponent},
{path: 'observatory/api/user',component:UserComponent},
{path:'observatory/api/admin', component:AdminComponent},
{path:'observatory/api/users', component:UsersComponent,canActivate: [AuthGuard]},

// otherwise redirect to home
{ path: '**', component:NotFoundComponent}

];