Angular路由守卫中获取首个true值的RxJS操作符选择

你需要的是优先响应任意Observable的true值，仅当所有Observable都返回false时才返回false的逻辑，推荐使用RxJS的race操作符结合merge+filter、forkJoin来实现：

实现代码 #

import { race, merge, forkJoin } from 'rxjs';
import { filter, take, map } from 'rxjs/operators';

// 1. 监听任意Observable发出的true，一旦出现立刻发出true并终止订阅
const anyTrue$ = merge($obs1, $obs2, $obs3).pipe(
  filter(value => value), // 只保留true值
  take(1) // 取第一个true就停止
);

// 2. 等待所有Observable完成，检查是否全部返回false，是则发出false
const allFalse$ = forkJoin([$obs1, $obs2, $obs3]).pipe(
  map(results => {
    // 判断所有结果是否都是false
    const isAllFalse = results.every(val => !val);
    return isAllFalse ? false : true;
    // 注：如果有任意结果是true，这里其实不会走到race的这一分支，因为anyTrue$会先触发
  })
);

// 3. 用race竞争两个Observable，谁先发出值就用谁的结果
const guardResult$ = race(anyTrue$, allFalse$);

逻辑说明 #

• merge会同时订阅三个Observable，只要其中一个发出true，anyTrue$就会立刻输出true，race会优先采用这个结果，并自动取消对allFalse$的订阅（也就是终止另外两个未完成的Observable）。
• 如果三个Observable最终都返回false，allFalse$会在所有Observable完成后输出false，这就是守卫的最终返回值。

这种方案完全符合你的需求：既可以让多个Observable同时运行，又能在第一个true出现时立刻终止所有未完成的Observable，仅当全false时才返回false。

内容的提问来源于stack exchange，提问作者Sergej