仅限 Firestore returns 最后一个文档

Question

我正在使用 AngularFirestore 和 NgRx，但我遇到了一个问题，即当我对同一方法有多个请求时，只有最后一个得到满足。我该如何解决这个问题？

数据库方法

// Using: import { AngularFirestore } from '@angular/fire/firestore';
getUnit(unitId: string): Observable<Unit> {  
  const unit$ = this.afs
    .collection<Unit>(constants.dbCollections.units)
    .doc(unitId)
    .snapshotChanges()
    .pipe(map((x) => x.payload.data()));

  return unit$;
}

使用多个 ID 可以正确调用此方法。

效果

loadUnit = createEffect(() =>
  this.actions$.pipe(
    ofType(unitActions.loadUnit),
    switchMap(({ unitId }) => {
      console.log('EFFECT CALL: ' + unitId);
      return this.dbService.getUnit(unitId).pipe(
        map((unit) => {
          console.log('EFFECT MAP: ID' + unitId, unit);
          return unitActions.unitLoaded({ unit });
        })
      );
    })
  )
);

此记录：

EFFECT CALL: re_demo_d4_c01_u01
EFFECT CALL: re_demo_d4_c01_u02
EFFECT CALL: re_demo_d4_c01_u03
EFFECT CALL: re_demo_d4_c01_u04
EFFECT CALL: re_demo_d4_c01_u05
EFFECT MAP: IDre_demo_d4_c01_u05 {thumbnail: "[url]", title: "10% 25% 50% 100%", introduction: Array(4), id: "re_demo_d4_c01_u05", name: "Procenten en breuken", …}
EFFECT MAP: IDre_demo_d4_c01_u05 {thumbnail: "[url]", title: "10% 25% 50% 100%", introduction: Array(4), id: "re_demo_d4_c01_u05", name: "Procenten en breuken", …}

MAP 被触发两次这一事实是我不太了解的另一件事，但可以通过在 DB 方法中管道 sharedReplay 来解决。不过这似乎不是手头的问题。

如何获取所有文档？

我正在使用：

"@angular/fire": "^6.1.4",
"firebase": "^7.24.0",
"rxjs": "^6.6.3",
"@ngrx/core": "^1.2.0",
"@ngrx/effects": "^10.1.2",

Answer 1

这是高阶可观察映射的错误。在我看来，我使用的是 switchMap 取消了所有未完成的可观察对象。我想要的是所有 observables 完成（并行），这是使用 mergeMap

完成的

mergeMap(({ unitId }) =>
        this.dbService
          .getUnit(unitId)
          .pipe(map((unit) => unitActions.unitLoaded({ unit })))

在此处找到详细说明：https://blog.angular-university.io/rxjs-higher-order-mapping/

另一个奇怪的事情是内部 observable 发出两次，已通过在文档中添加 get 解决。

.collection<Unit>(constants.dbCollections.units)
      .doc(unitId)
      .get()

仅限 Firestore returns 最后一个文档

Firestore only returns last doc

firebase

angularfire2

angular

google-cloud-firestore