angular fire/firebase > fetch collection 并为每个文档获取其子集合答案

【问题标题】：angular fire/ firebase > fetch collection and for each document fetch its sub collectionangular fire/firebase > fetch collection 并为每个文档获取其子集合
【发布时间】：2020-11-26 01:36:58
【问题描述】：

我有一个市场集合每个市场都有一个产品集合..我正在尝试查询以获取所有这些..我最终得到了一个解决方案，但我在第 9 行得到了关于 compineLatest 的提示“@deprecated — 改为在单个数组中传递参数"。

想知道有没有更好的abroach以及如何正确使用compineLatest。

  //#region fetch method
  private fetch(marketsRef: AngularFirestoreCollection<Market>) {
    return marketsRef
      .snapshotChanges()
      .pipe(
        switchMap(markets => {
          if (!markets.length) {
            this._noDataSubject$.next(true);
          }
          return combineLatest([markets],
            combineLatest(
              markets.map(market => {
                return this.firestore.collection<MarketProduct>(`markets/${market.payload.doc.id}/products`, ref => {
                  return ref.orderBy('reviewResult')
                })
                  .snapshotChanges()
              })
            )
          )
        }), map(([markets, products]) => {
          const allProducts = products.reduce((acc, val) => acc.concat(val), []);
          const returnedMarkets = markets.map(market => {
            return {
              id: market.payload.doc.id,
              ...market.payload.doc.data() as Market,
              products: allProducts
                .filter(product => product.payload.doc.ref.path === `markets/${market.payload.doc.id}/products/${product.payload.doc.id}`)
                .map(product => {
                  return {
                    id: product.payload.doc.id,
                    ...product.payload.doc.data() as MarketProduct
                  }
                })
            }
          }) as MarketId[];
          return returnedMarkets;
        }))
  }
  //#endregion fetch method

  //#region fetch  new markets request
  fetchNewMarkets() {
    const key = `name.ar`;
    const marketsRef = this.firestore.collection<Market>('markets', ref => {
      return ref.where('reviewResult', '==', null).orderBy(key);
    });
    this.fetch(marketsRef)
      .subscribe(markets => {
        this._marketsChanges$.next(markets);
      })
  }
  //#endregion fetch new markets request

【问题讨论】：

标签： javascript firebase google-cloud-firestore rxjs angularfire

【解决方案1】：

return combineLatest([markets], combineLatest(/* ... */));

你有这条线。第一个 combineLatest 有 2 个参数。签名 combineLatest(...obs) 已弃用。您需要做的就是将您的第二个 combineLatest 添加到数组中。

return combineLatest([markets, combineLatest(/* ... */)]);

编辑，补充建议

// const allProducts = products.reduce((acc, val) => acc.concat(val), []);
const allProducts = products.flat();

【讨论】：

真的很感谢你的回答.. 我稍微修改了我的代码以获得结果，但我没有注意到 combineLatest 需要一个可观察的数组，直到你提到它：D，对于 array.flat( ) 我知道，但该项目有 es2016 Ill change it to 2019 ... thx again. Ill 过去我的代码作为答案

【解决方案2】：

我的结束代码

//#region fetch method
  private fetch(marketsRef: AngularFirestoreCollection<Market>) {
    return combineLatest([
      marketsRef.snapshotChanges(),
      marketsRef.snapshotChanges()
        .pipe(
          switchMap(markets => {
            if (!markets.length) {
              this._noDataSubject$.next(true);
            }
            return combineLatest(
              markets.map(market => {
                return this.firestore.collection<MarketProduct>(`markets/${market.payload.doc.id}/products`, ref => {
                  return ref.orderBy('reviewResult')
                })
                  .snapshotChanges()
              })
            )
          })

        )]).pipe(map(([markets, products]) => {
          const allProducts = products.reduce((acc, val) => acc.concat(val), []);
          return markets.map(market => {
            return {
              id: market.payload.doc.id,
              ...market.payload.doc.data() as Market,
              products: allProducts
                .filter(product => product.payload.doc.ref.path === `markets/${market.payload.doc.id}/products/${product.payload.doc.id}`)
                .map(product => {
                  return {
                    id: product.payload.doc.id,
                    ...product.payload.doc.data() as MarketProduct
                  }
                })
            }
          }) as MarketId[];
        }));
  }
  //#endregion fetch method

  //#region fetch  new markets request
  fetchNewMarkets() {
    const key = `name.ar`;
    const marketsRef = this.firestore.collection<Market>('markets', ref => {
      return ref.where('reviewResult', '==', null).orderBy(key);
    });
    this.fetch(marketsRef)
      .subscribe(markets => {
        this._newMarketsChanges$.next(markets);
      })
  }
  //#endregion fetch new markets request

【讨论】：