Question

我有一个只有所有者才有权访问的用户设置页面。我想使用CanActivate来实现限制。 CanActivate要求输出为布尔值或布尔值的可观察值。但是，我的代码输出一个可观察的布尔值的可观察量。

Type 'Observable<Observable<boolean>>' is not assignable to type 'boolean | Observable<boolean> | Promise<boolean>'.

这是我的代码

@Injectable()
export class UserGuard implements CanActivate {

  constructor(
    private route: ActivatedRoute,
    private userService: UserService
  ) { }

  canActivate() {
    const username = this.route.snapshot.paramMap.get('username');

    return this.userService.authState().map(auth => {
      return this.userService.getByUid(auth.uid).map(user => {
        return user.username === username ? true : false;
      });
    });
  }
}

Answer 1

使用.switchMap来展平可观察对象。在此处阅读更多内容：https://www.learnrxjs.io/operators/transformation/switchmap.html

基本上如果你将.switchMap链接到一个源可观察对象并返回一个内部observable， observable将被订阅并且它的值被发出而不是发出的observable本身：

return this.userService.authState().switchMap(auth => {

在这种情况下，您还可以通过将.map链接到原始可观察流来轻微展平代码。

return this.userService.authState().switchMap(auth =>
  this.userService.getByUid(auth.uid)
).map(user => user.username === username);

CanActivate：转换Observable <observable <boolean>＆gt;到Observable <boolean>

1 个答案: