使用 angularfire2 firestore 的 Observable 中的 Observable 值 [英] value from Observable within Observable using angularfire2 firestore

问题描述

我试图在从 collection 查询 document 时查询子集合是否存在.我的第一个查询 returns/maps 数据正确，但是当我尝试查询 subcollection 时，它将作为 observable 存储在 Observable<;数据>.以下是我到目前为止/尝试过的内容.

I am trying to query a sub-collection if exists while querying for document from collection. My first query returns/maps data properly but when I try to query the subcollection it will be stored as observable within the Observable<data>. Below is what I have/tried so far.

component.ts

availableCategoriesCollection: AngularFirestoreCollection<Category>;
availableCategories$: Observable<CategoryId[]>;
lstCategories: Observable<any>;

this.availableCategoriesCollection = this.httpDataService.getAllCategories();
this.availableCategories$ = this.availableCategoriesCollection.snapshotChanges().map(data => {
  return data.map(record => {
    const rec = record.payload.doc.data() as Category;
    const cId = record.payload.doc.id;
    return {cId, ...rec};
  });
});

this.lstCategories = this.availableCategories$.map(data => {
  return data.map((rec: CategoryId) => {
    //if a category has subcategory then query the document again for subcollection
    if (rec.hasSubCat) {
      return this.httpDataService.getSubCategory(rec.cId).snapshotChanges().concatMap(d => {
        return d.map(r => {
          const arr: any = {};
          arr.id = r.payload.doc.id;
          arr.itemName = (r.payload.doc.data() as Category).categoryName;
          arr.category = rec.categoryName;
          return arr;
        });
      });
    }else {
      const arr: any = {};
      arr.id = rec.id;
      arr.itemName = rec.categoryName;
      arr.category = 'All';
      return arr;
    }
  });
});

当我查看 lstCategories 值时，具有 subcollection 的文档将作为 Observable 返回，而没有的文档将返回subcollection 返回带有 id、itemName 和 category 的正确 data.类似于以下内容:

When I look into the lstCategories value, the documents that have subcollection will be returned as Observable and the ones which don't have subcollection returns proper data with id,itemName and category. Something like below:

(9) [{…}, Observable, Observable, {…}, {…}, {…}, {…}, {…}, Observable]

(9) [{…}, Observable, Observable, {…}, {…}, {…}, {…}, {…}, Observable]

如何正确订阅子查询?我在这里错过了什么?

How can I properly subscribe to the sub-query? What am I missing here?

推荐答案

所以你的问题是 map 的回调有时返回一个普通对象，有时返回一个 Observable.我猜你仍然想发出一个对象数组(包括内部 Observables 中的那些)而不是一个一个地发出项目.

So your problem is that the maps callback sometimes returns a plain object and sometimes returns an Observable. I guess you still want to emit an array of objects (including those inside the inner Observables) instead of emitting items one by one.

我认为最简单的方法是使用 forkJoin 并始终返回一个 Observable(即使结果可能是一个普通对象):

I think the easiest way to do this is using forkJoin and always returning an Observable (even when the result could be a plain object):

this.lstCategories = this.availableCategories$.mergeMap(data => {
  const observables = data.map((rec: CategoryId) => {
    if (rec.hasSubCat) {
      return this.httpDataService... // Observable
    } else {
      const arr: any = {};
      ...
      return Observable.of(arr); // Observable
    }
  }

  return Observable.forkJoin(observables);
});

还要注意，我必须使用 this.availableCategories$.mergeMap() 因为 mergeMap 将订阅 forkJoin Observable 并发出它的结果.

Also notice that I had to use this.availableCategories$.mergeMap() because mergeMap will subscribe to the forkJoin Observable and emit its result.

这篇关于使用 angularfire2 firestore 的 Observable 中的 Observable 值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！