Question

我使用angularFire2和Cloud Firestore获取Angular（4）应用中的项目列表以获取Observable：

private itemCollection: AngularFirestoreCollection<Item>;
items: Observable<ItemId[]>;
constructor(private readonly afs: AngularFirestore) {
  this.itemCollection = afs.collection<Item>('items');
  this.items = this.itemCollection.snapshotChanges().map(actions => {
  return actions.map(a => {
    const data = a.payload.doc.data() as Item;
    const id = a.payload.doc.id;
    return { id, ...data };
    });
  });

然后我在我的组件中使用* ngFor和异步管道列出了这个Observable：

<span *ngFor="let item of items | async">

这很好用，当我添加一个新项时，它会自动显示在列表中。然而，当我更新项目的分数时，Observable会更新，但我仍然会看到该项目的旧版本（不是更新的项目的新分数）。如果我点击刷新，我会看到更新版本。

我以这种方式更新项目的分数：

updateItem(id: string, score: number): void {
  this.collectionRef.doc(id).update({ score });

}

当我更新项目的分数时，如何自动查看Observable中的更新项目？

Answer 1

Angular的可观察性并不像那样。您需要为观察者提供值以刷新可观察对象。您将需要覆盖您的变量以启动刷新。像这样：

updateItem(id: string, score: number): void {
  this.collectionRef.doc(id).update({ score });
  this.items = [already updated items document]
}

我希望我是对的:)

Cloud Firestore更新已修改的文档

1 个答案: