Angular Routing CanActivate 与 Observable 一起工作

发布于06月27日

我有一个实现CanActivate的AuthGuard(用于路由).

canActivate() {
    return this.loginService.isLoggedIn();
}

我的问题是，CanActivate结果取决于http get结果——LoginService返回Observable.

isLoggedIn():Observable<boolean> {
    return this.http.get(ApiResources.LOGON).map(response => response.ok);
}

我如何将这些结合在一起-使CanActivate依赖于后端状态？

# # # # # #

EDIT: Please note, that this question is from 2016 - a very early stage of angular/router has been used.

# # # # # #

推荐答案

您应该将"@ANGLING/ROUTER"升级到最新版本.例如"3.0.0-α8"

modify AuthGuard.ts

@Injectable()
export class AuthGuard implements CanActivate {
    constructor(private loginService: LoginService, private router: Router) {}

    canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        return this.loginService
            .isLoggedIn()
            .map((e) => {
                if (e) {
                    return true;
                }
            })
            .catch(() => {
                this.router.navigate(['/login']);
                return Observable.of(false);
            });
    }
}

如果你有任何问题，问我