守卫中的Angular 4 HTTP请求

Question

我试图在内部使用HTTP请求，但总是遇到错误。 当我删除HTTP请求并使用if条件时，它就可以工作。

isAdmin.guard.ts

import { Injectable } from '@angular/core';
import { Router ,CanActivate } from '@angular/router';
import { AuthService } from '../services/auth.service';

@injectable()

export class IsAdmin implements CanActivate {
    constructor(
        private auth:AuthService,
        private router:Router
    ){}


    canActivate(){
        //get user data
        this.auth.getUserData().subscribe((data)=>{
            if(data.isAdmin){
                return true;
            }else{
                this.auth.loggedIn();
                this.router.navigate(['/login']);
            }
        })
    }


}

来自编辑的照片

Answer 1

CanActivate必须返回$timestamp，如您在此link中所见。

Observable<boolean> | Promise<boolean> | boolean

在您的情况下，您应该只返回interface CanActivate { canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean } 。但是这样的函数没有返回this.auth.getUserData()，而是返回Observable<boolean>。因此，您应该将其映射为返回Observable<data>：

Observable<boolean>