angular/firebase 格式将数据从 firebase 检索到数组中

Question

大家好，我在将 firebase 数据格式化为数组时遇到问题

这是我从 firebase 检索数据的服务

文件名：subcategory.service.ts

export class SubcategoryService {

  subcategoryRef: AngularFireList<any> = null;

  constructor(private db: AngularFireDatabase) {
   this.subcategoryRef = db.list("/subCategory");
  }

  getSubCategoriesById(inp_subCatid: string): Observable<any[]> {
    return this.subcategoryRef.snapshotChanges().pipe(
      take(1),
      map(changes => changes.map(c =>
        ({ key: c.payload.key, ...c.payload.val() })
      ).filter((subCat) =>
        subCat.catid === inp_subCatid
      )
    ));
  }
}

我在以下文件中调用函数 getSubCategoriesById()

文件名：subcategory.page.ts

    this.SubcategoryService.getSubCategoriesById("cat01")
      .subscribe(subCategories =>
        this.subCat = Object.values(subCategories)
    )

我正在检索的对象的结构看起来像这样

有一个数组，其中有一个对象，其中我的目标对象是

但我想将数据格式化为以下结构

[
 alcoholic:{
             active:true,
             ageRating: true,
             catgeory: "cat01"
             ...
            },
 warmdrinks:{
             active:true,
             ageRating: false,
             catgeory: "cat01"
             ...
            },
 softdrinks:{
             active:true,
             ageRating: false,
             catgeory: "cat01"
             ...
            },
]

这样我就有了一个里面有 3 个对象的数组。

我在这个案例中的 firebase 数据库看起来像这样

希望有人可以帮助我，如果有人需要更多信息，请告诉我

Answer 1

我认为你应该使用 valueChanges 而不是 snapshotChanges()

return this.getSubCategoriesList().snapshotChanges().pipe(

到

return this.getSubCategoriesList().valueChanges().pipe(

valueChanges 返回一个文档数据的 Observable。元数据被剥离。

我假设你正在使用 Angularfire...

Answer 2

您可以在最后一个数组映射的链中添加一个映射以获取您想要的属性：

getSubCategoriesById(inp_subCatid: string): Observable<any[]> {
  return this.subcategoryRef.snapshotChanges().pipe(
      take(1),
      map(changes => changes.map(c =>
        ({ key: c.payload.key, ...c.payload.val() })
      ).filter((subCat) =>
        subCat.catid === inp_subCatid
      ).map(({alcoholic,softdrinks,warmdrinks,...rest}) => ({
        alcoholic,softdrinks,warmdrinks
      })
    ));
  }