Route Guard：如何根据 HttpPost 设置的参数设置 true 或 false？答案

【问题标题】：Route Guard: How can I set true or false based on params set from HttpPost?Route Guard：如何根据 HttpPost 设置的参数设置 true 或 false？
【发布时间】：2018-08-13 18:09:43
【问题描述】：

我的代码：

@Injectable()

export class UserRouteAccessService implements CanActivate {

    authorized = [
        'AGREEMENTS_VIEW',
        'PROSPECTS_VIEW',
        'AGREEMENTS_INSERT_UPDATE',
        'PRODUCTS_INSERT_UPDATE',
        'PROSPECTS_INSERT_UPDATE',
        'DOCUMENTS_VIEW',
        'DOCUMENTS_INSERT_UPDATE',
    ];

    constructor(private router: Router, private securityService: CralSecurityService) {
    }



    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
        //boolean var


        this.securityService.securityActions().subscribe(
            data => {
                //control if auth. is correct

                //if yes set true
                //if not set false
            },
            error => {
                //return an error
            }
        )
        //return boolean
    }
}

cmets 是我喜欢做的事情，但我真的不知道我应该写什么，因为这是我第一次使用 angular 4。

基本上，如果已发送来自授权的某些参数，我想设置 True，如果服务中没有参数，则设置为 false。

我希望这很清楚，如果您需要更多信息，请告诉我:)

服务：

securityActions(): Observable<any> {
    return this.http.post<Observable<any>>(
        `${this.ENDPOINT}/security-actions`,
        null,
    );
}

【问题讨论】：

您的 securityService 订阅会返回什么？
使用服务编辑
那么data 有什么？
在安全服务成功的情况下，this.route.params.subscribe(params => console.log(params));...对象中的参数，所有参数都作为键/值。你可以添加你的逻辑并返回真/假。
服务返回一个包含字符串列表的数组，这些字符串是“授权”数组中的字符串。它向我发送一些/全部/没有这些字符串，并根据是否有东西到达我必须设置它的真假

标签： angular typescript canactivate angular-route-guards

【解决方案1】：

你想返回一个布尔值，但布尔值只能异步获取。所以你不能返回一个布尔值。幸运的是，正如您在方法的返回类型中看到的那样，您可以返回一个Observable<boolean>。一个 Observable（或一个 Promise）正是用来做到这一点的：返回一个异步结果。

所以，不要订阅 securityActions() 返回的 observable。相反，使用 map() 和 catchError() 运算符将 observable 转换为 Observable：

return this.securityService.securityActions().pipe(
    map(data => {
            //control if auth. is correct

            //if yes set true
            //if not set false
    },
    catchError(() => of(false))
);

注意：如果您仍在使用旧版本的 Angular 和 RxJS，那么您应该升级。如果你真的还不能，你需要将上面的代码修改为你正在使用的旧版本的 RxJS：

// TODO import the required operators, as documented in your old version of RxJS

return this.securityService.securityActions().map(
    data => {
            //control if auth. is correct

            //if yes set true
            //if not set false
    }
).catch(() => of(false));

【讨论】：