@angular/fire：如何使用 startAt() 和 endAt() 检索结果答案

【问题标题】：@angular/fire: How to retrieve results with startAt() and endAt()@angular/fire：如何使用 startAt() 和 endAt() 检索结果
【发布时间】：2019-02-08 05:27:57
【问题描述】：

我正在为使用 angular 和 firebase 设计的聊天应用程序开发虚拟滚动。对话消息存储在 firebase 实时数据库中。

（当我们展开一个孩子时，数据看起来像这样）

我需要先加载最后 50 个对话，然后当用户向上滚动聊天时，我需要加载接下来的 50 个对话，依此类推。

我尝试使用startAt(), endAt() 方法检索数据，但没有从firebase 返回结果。

【问题讨论】：

你能分享你的代码吗？您如何准确地使用 startAt() 和 endAt()？你可能看过这个 SO question and answer，特别是答案 #2 stackoverflow.com/questions/50112214/…

标签： angular firebase firebase-realtime-database

【解决方案1】：

第一次查询需要使用 .limit(50)，连续查询需要使用 .limit(50) 和 .startAfter()。您不必使用 endAt 或 endAfter。

您还需要根据某个字段对结果进行排序，并使用相同的字段对所有查询进行排序。所以，对于第一个查询：

ref.where(...).orderBy(...).limit(50);

然后将最后一个文档引用存储在响应中。

对于所有连续查询：

ref.where(...).orderBy(...).startAfter(lastDocumentRef).limit(50);

【讨论】：