Javascript Angularfire-如何应用&x27；其中'；具有快照更改（）的条件

我对angular&firebase相当陌生，目前正在使用angular/fire检索服务中具有以下条件的集合

服务.ts

get posts() {
  return this.afs
          .collection<Todo>('posts', ref => {
            let query:
              | firebase.firestore.CollectionReference
              | firebase.firestore.Query = ref;

            query = query.where('posted', '==', true);

            return query;
          })
          .snapshotChanges()
          .pipe(
            map(action =>
              action.map(a => {
                const data = a.payload.doc.data();
                const id = a.payload.doc.id;
                return { id, ...data };
              }),
            ),
          );
}

ngOnInit() {
    this.service.posts.subscribe(posts => {
      console.log(posts);
    })
}

但是，当添加“posted”字段等于false的帖子时，该帖子也会被记录在控制台中

在某种程度上，这对我来说是有意义的，因为集合被更新，组件被订阅，从而导致更新

然而，我的期望是，如果集合发生了变化，它仍然会应用条件并再次过滤掉

---

谢谢大家帮助一个新手，我不太清楚angularfire2和firebase，但是你可以利用数组的map操作符和filter操作符

尝试：

---

是的，这是一种可能的做法，但在我看来（我不确定），这种方法将导致重复逻辑，即（1）过滤由firebase完成，（2）过滤由应用程序完成。这意味着，最终我仍然会从firebase（服务器）获得一整套数据，我希望避免这些数据。如果只有几张唱片，那就没问题了，但如果是10k+的话，这听起来有点不对劲。我和你有同样的担心，但就像我说的，我对这些技术不太了解：/你能澄清一点吗？您的组件仅使用显示的代码初始化一次（

ngOnInit（）

仅运行一次），并记录已发布的文档？或者您已经运行了两次（初始化组件两次）？如果您的应用程序需要多次订阅

snapshotChanges（）

，您也应该取消订阅（您通常在

ngOnInit（）

中订阅，在

ngondestory（）中取消订阅）

。如果您只需要在模板中显示您的项目，则无需手动订阅，您可以使用

异步

管道，以便自动处理订阅。我还发现，在每个文档中添加

id

作为字段并使用

valueChanges（）

而不是

快照更改（）非常方便

，但这与此无关。@Stratubas，我正在使用一个模式添加帖子&主组件，其中帖子列表从未被重新初始化/销毁（仍然实现了销毁和取消订阅）因此，当项目添加为'posted'==true时，它总是在监听更改，至少这是我的预期。尝试打开另一个浏览器选项卡，并从该选项卡添加一个posted=false帖子。它是否记录在第一个选项卡中？如果您使用firebase控制台手动添加它会怎么样？仍然记录？@Stratubas，我尝试了您的建议并进行了说明关于手动订阅的广告，我正在使用异步管道，它正在按预期工作。非常感谢您的帮助：）将必须了解更多有关可观测的信息。

ngOnInit() {
    this.service.posts.pipe(
      map(posts => posts.filter(post => post.posted)),
    ).subscribe(posts => {
      console.log(posts);
    })
}