如何将多个Firestore数据库集合查询结果合并到单个数组中

问题根源 #

现有代码使用merge操作符存在逻辑缺陷：merge仅会按触发顺序逐个发射各子集合的查询结果，每次订阅拿到的都是单个课程下的lesson列表，无法汇总所有子集合的最新数据。

解决方案 #

改用combineLatest操作符替换merge，可以实现所有子集合查询结果的实时合并，任意子集合数据更新时都会自动返回全量最新的lesson数组，修改后代码如下：

// 提前导入rxjs依赖
import { combineLatest } from 'rxjs';
import { map, switchMap } from 'rxjs/operators';

loadAllLessons(): Observable<Lesson[]> {
  return this.getAllLessonsRef()
    .pipe(
      switchMap(lessonRefs => {
        // 每个子集合查询先做数据转换，得到单个课程的Lesson数组
        const lessonObservables = lessonRefs.map(ref => 
          this.db.collection(ref).snapshotChanges()
            .pipe(map(snap => convertSnaps<Lesson>(snap)))
        );
        // 合并所有子集合的最新结果，返回二维数组
        return combineLatest(lessonObservables);
      }),
      // 把二维数组打平为一维的全量Lesson数组
      map(lessonArrays => lessonArrays.flat())
    );
}

方案说明 #

• combineLatest会等待所有子集合的查询都至少返回一次结果后，才会第一次发射数据，之后任意子集合数据更新，都会自动汇总所有子集合的最新结果返回
• 如果需要保留lesson所属的课程ID信息，可以在convertSnaps转换时额外为Lesson对象追加courseId字段，适配业务需求
• 相比forkJoin（仅发射一次最终结果），combineLatest可以保留Firestore的实时更新特性，符合snapshotChanges的使用场景

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