Angular Route Guard：如何根据服务器发送的列表实现Route Guard？

我试图在我的应用程序中使用route guard，只有当服务器向您发送一些参数时，它才允许您访问组件

这是服务器可以发送给我的参数列表（并非每次都发送所有参数）

我的路线守卫：

@Injectable()
export class UserRouteAccessService implements CanActivate {
    userActions=[];
    constructor(private router: Router, private securityService:CralSecurityService) {
     }
     securityActions(){debugger;
        this.securityService.securityActions().subscribe(
           (res: Array<actions>) => {
             this.userActions = res;
             console.log(res);

           });
       }


    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        this.securityActions();

        if (this.userActions = actions ) {
            return true;
        } else {
            return false;
        }
    }

Http post:

securityActions（）：{
返回this.http.post(
`${this.ENDPOINT}/security actions`，
无效的
);
}

如下所示：

interface CanActivate {
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean
}

接口可以激活{
canActivate（路由：ActivatedRouteSnapshot，状态：RouterStateSnashot）：可观察的|承诺|布尔值
}

这意味着您可以返回一个返回布尔值的HTTP调用

所以你可以这样写：

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

securityActions(): Observable<boolean> {
  return this.securityService.securityActions().pipe(
    map(response => this.authorized.includes(response))
  );
}


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

authorized=[
"意见",，
"展望",，
“协议插入更新”，
“产品插入更新”，
“潜在客户插入更新”，
“文档视图”，
“文件插入更新”，
];
securityActions（）：可观察{
返回此.securityService.securityActions（）.pipe(
映射（响应=>this.authorized.includes（响应））
);
}
canActivate（路由：ActivatedRouteSnapshot，状态：RouterStateSnashot）：可观察的|承诺|布尔值{
返回此.securityActions（）；
}

请记住，

canActivate

也可以返回可观察的。感谢您的帮助，“includes”表示属性不存在于“string[]”类型中，并且在canActivate方法中，return告诉我void不能分配给boolean:）类型，然后使用

。indexOf（response）！=-1

，我编辑了我的回答仍然没有“声明类型不是“void”或“any”的函数必须返回一个值，这是可观察的。我用服务更新了我的帖子，我的HttpPostMy又坏了，我在securityActions中缺少了一个

return

语句！谢谢！最后一个错误是“response”（我希望：P）在securtyActions方法中，它告诉我“参数boolean不能分配给类型为“string”的参数。我还尝试了“.indexOf（response）！=”-1“但这是一样的^^

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

interface CanActivate {
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean
}

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

securityActions(): Observable<boolean> {
  return this.securityService.securityActions().pipe(
    map(response => this.authorized.includes(response))
  );
}


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