AngularFire2 检索不订阅更改（Firestore）答案

【问题标题】：AngularFire2 retrieve don't subscribe to changes (Firestore)AngularFire2 检索不订阅更改（Firestore）
【发布时间】：2026-02-12 01:10:02
【问题描述】：

在我的网站中，我想按名称显示项目列表。名称是可点击的，然后应该下载整个文档，您可以编辑和保存项目。

目前我正在使用文档中描述的方式从我的 FireStore 中查询集合数据：https://github.com/angular/angularfire2/blob/master/docs/firestore/collections.md

  private itemsCollection: AngularFirestoreCollection<Item>;
  items: Observable<Item[]>;
  constructor(private afs: AngularFirestore) {
    this.itemsCollection = afs.collection<Item>('items');
    this.items = this.itemsCollection.valueChanges();
  }

问题是，我确实不想要或需要对我的列表进行实时更新。所以 Observable 方法对我的应用没有意义。

我想出的唯一方法是我只使用 snapshotChanges 方法，并将其映射到一个数组，然后我将其分配给一个字段。在映射函数之后，将 items 和 itemsCollection 字段设置为 null，这样它们就不会再浪费任何带宽了。但这对我来说似乎不对。

有没有办法在 AngularFire 中只查询一次集合，最好使用查询参数，然后显示它？

【问题讨论】：

也许有用的东西：github.com/angular/angularfire2/blob/master/docs/firestore/…

标签： angular angularfire2

【解决方案1】：

我处理此问题的一种方法是使用rxjs/add/operator/first。此方法获取 Observable 数据一次，然后结束订阅。

只需在上面导入该库并像这样进行调用：

this.items = this.itemsCollection.valueChanges().first();

那么你可以订阅它，它只会获取一次数据：

this.items.subscribe((items) => { // do something with items array // });

我知道还有其他方法可以使用 rxjs do() 和 take() 方法来处理此问题，您可能想查看这些方法。我希望这能有所帮助！

【讨论】：

【解决方案2】：

正如 Nicholas Pesa 已经回答的那样，使用 .first() 运算符可以工作，唯一需要注意的是它在发出值后不会取消订阅。如果您将 .take(integer) 运算符用作 .take(1)，则可观察对象将在发出第一个值后完成。那是不正确的。以下关于 observables 的注释曾经并且现在仍然有效。

通过这种方式，您实际上让自己的事情变得更加困难，几乎没有任何好处。可观察的方法使事情变得更容易，即使您不会真正使用可观察的流方法。只需让异步管道 (|) 为您处理订阅，这样您就不必担心订阅或退订。如果你的数据没有改变，那么模板只会在第一次调用 firestore 中的那个集合。

【讨论】：

能否请您链接到您断言first() 不会取消订阅其来源的来源？我的理解一直是first() 和take(1) 在很大程度上是等价的。

【解决方案3】：

如果您愿意，可以使用标准的 Firebase SDK for Web，它提供基于 Promis 的 API（查看文档 here），这样您就可以在您的服务中创建一个 Promise 类型的 getter（或 Observable.fromPromise()只会发射一次）：

import * as firebase from 'firebase';

const itemsRef = firebase.firestore().collection('items');

// Into your service:
getItems(): Promise<Item[]> {
  const items: Item[];
  return itemsRef.get()
  .then(colSnap => colSnap.docs().map(snapshot => snapshot.data()));
}

【讨论】：