Angular Firebase 从 Firestore 获取列表答案

【问题标题】：Angular Firebase get list from firestoreAngular Firebase 从 Firestore 获取列表
【发布时间】：2019-02-04 07:57:48
【问题描述】：

我想知道如何从 Cloud Firestore 中获取列表。

我上传这样的列表：

export interface Data {
  name: string;
  address: string;
  address2: string;
  pscode: string;
  ccode: string;
  name2: string;
}

constructor(private afs: AngularFirestore){
    this.notesCollection = this.afs.collection(`imones`, (ref) => ref.orderBy('time', 'desc').limit(5));
}

  notesCollection: AngularFirestoreCollection<Data>;

//creating item in list (imones)

createItem(){
  this.notesCollection.add(this.busines);
}

现在的问题是如何从那里获取所有列表项？

这是我的尝试：

constructor(private afs: AngularFirestore){
  this.items = this.notesCollection.valueChanges();
}
  items: Observable<Data[]>;

HTML：

 <p *ngFor="let item of items">{{item.name}}</p>

错误：

错误错误：找不到不同的支持对象“[object Object]” '对象'类型。 NgFor 仅支持绑定到 Iterables，例如数组。

又报错了：

【问题讨论】：

你可能需要异步管道：*ngFor="let item of items | async" .... 阅读更多内容codecraft.tv/courses/angular/pipes/async-pipe
什么也没显示
在不知道您的数据等的情况下难以调试...首先在您的代码中订阅 valueChanges 并设置断点/日志到控制台：即this.items = this.notesCollection.valueChanges().subscribe ( //debug here ) 以查看您是否实际获取任何数据来自你的 Observable
我真的认为有一种从firestore获取列表对象的正常方法，而不仅仅是试图猜测..
this.notesCollection.valueChanges().subscribe(data => console.log(data)); - 给出未定义的。我会给出我的物品在 Firestore 中的样子的图片。

标签： javascript angular typescript firebase google-cloud-firestore

【解决方案1】：

我不确定您是否可以像这样遍历模板中的 observable。我会这样做：

constructor(private afs: AngularFirestore){
  this.notesCollection.valueChanges().subscribe(items => this.items = items);
}
  items: Data[];

【讨论】：