Angular 4 在第一次完成后调用一个可观察对象然后 return 一个值

Question

我遇到了一个大问题，经过数小时的阅读文档和解决方案后，我找不到解决这个问题的方法：

基本上我的angular守卫着这个：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        return this.checkLogin(route);
    }

    checkLogin(route) {
        return this.authService.login().map(response => {
            if (this.authService.isAuth) {
                return this.authService.grants().map(grants => {
                    if (grants.canRead) {
                        return true;
                    }
                })
            }
        });
    }

我想做的是首先调用服务 authService.login，如果我通过了身份验证，那么我会调用 authService.grants 来检查用户是否可以阅读此页面。

就这么简单，但我无法进入第二个调用，我不知道为什么它会返回一个 observable。

Answer 1

没有你的方法定义，我假设如下：

interface Rights {
   canRead: boolean;
}

class AuthService { 
  grants(): Observable<Rights>{}
  login(): Observable<any>{}
}

问题是，目前您的 checkLogin 方法的 return 类型是 Observable<boolean>| Observable<Observable<boolean>>。这是因为：

如果 this.authService.isAuth 是 false， 外部映射 将产生 Observable<boolean>，因为您只需 return false.
如果 this.authService.isAuth 是 true， 外部映射 将产生 Obsevable<Observable<boolean>>，正如您现在将 return另一个异步的映射值。操作。

所以使用它，你应该将你的守卫重构为以下内容：

import 'rxjs/add/operator/mergeMap'; // can be refactored to pipe + operator
import {of} from 'rxjs/observable/of';

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {
        return this.checkLogin(route);
    }

    checkLogin(route): Observable<boolean> {
        return this.authService.login().mergeMap(_=> {
            if (this.authService.isAuth) {
                return this.authService.grants().map(grants => grants.canRead)
            }else{
                return of(false);
            }
        });
    }
}

MergeMap 基本上允许您连接异步操作，并创建同步的可观察对象。值。

Angular 4 在第一次完成后调用一个可观察对象然后 return 一个值

Angular 4 call an observable after the first finish then return a value

observable

rxjs

angular

angular-router

angular-guards