javascript - angularfire2 firebase db 不显示对象列表中的所有项目

Question

我需要从下面给定的 firebase 数据库中检索数据:

以下是我检索数据的 TS 代码:

ionViewDidLoad(){
this.customerId = this.navParams.get('data');     
this.customerProvider.getData(this.customerId).snapshotChanges().subscribe(x =>{
  this.listOne = x
  this.listOne.forEach(y =>{
   this.listTwo = this.customerProvider.getListDetails(this.customerId, y.key).snapshotChanges()
   console.log(this.listTwo)
  })      
})
}

HTML 如下:

<ion-item>
  {{(listTwo | async)?.key}}
</ion-item>

问题是列表只显示 1 项，而 firebase 数据库有 3 项带键。以下是控制台截图

输出如下

以下是 vendor :

  getFile(customerId){
    return this.afDb.list(`response/${customerId}`)
  }

  getFileDetails(customerId, listOne): AngularFireObject<any>{
    return this.afDb.object(`response/${customerId}/${listOne}`)
  }

似乎是 forEach 或 AngularFire 对象问题，但不确定。

Answer 1

snapshotChanges() 返回类型为 AngularFireAction 的 Observable，您必须首先映射它以从中过滤数据。这也是为什么你只得到一个列表。尝试:

this.customerProvider
  .getData(this.customerId).snapshotChanges()
  .map(filter => {
    return filter.map(c => (
      // return keys only
      c.payload.key
    ));
  }
).subscribe(x => {
  this.listOne = x;
  console.log(x);
  this.listOne.forEach(y =>{
     this.listTwo = this.customerProvider
       .getListDetails(this.customerId, y.key).snapshotChanges()
       .map(filter => {
          filter.map(c => (c.payload.val()))
       })
    })
    console.log(this.listTwo);
 });

希望这对您有所帮助。我最近也开始学习 Angular。因此，我们将不胜感激任何反馈。