Angular 合并过滤帖子和加载更多帖子

在Angular和Firestore中，如何最好地结合过滤功能和加载更多功能？

用例：我最初只想加载最新的10篇文章。但是我想允许用户使用输入字段按文章标题进行过滤。此筛选器应搜索所有帖子，而不仅仅是最近的10篇

我如何在概念上实现这一点

• 如果我一次从Firestore加载了所有的帖子，我可以很容易地在我的组件中按帖子标题进行过滤（或者使用带有*ngFor的管道）

• 然而，如果我只加载了Firestore中的一些帖子，那么这种过滤方式显然只适用于那些已经加载的帖子。因此，如果我搜索一篇尚未加载的文章的标题，显然是行不通的

因此，我假设我必须以某种方式将过滤逻辑从前端移动到后端

我该怎么做？我是否必须在每次击键时都使用标题过滤器查询Firestore

这难道不意味着我失去了从只加载一些数据到现在向后端进行几十次搜索查询所获得的任何潜在节约吗？因此，最初一次加载所有帖子，然后在前端执行过滤不是更好吗

---

人们是如何做到这一点的？

说你有这样一个用户界面：

+----------------------------------------+
| Search: ______________________         |
+----------------------------------------+
|                                        |
|                                        |
|                                        |
...

然后，我使用以下逻辑：

• 如果搜索为空，我将显示集合中的前10项
• 如果搜索有值，我将显示集合中与搜索词匹配的前10项

第二步确实需要应用程序的搜索选项符合Firestore的查询模型，我保证这一点

---

使用这种方法，我最多只能得到10个项目（或者任何数量的项目合理地构成了一个充满内容的屏幕）。

不是每次击键时发送请求，通常会引入一个去盎司时间，以限制请求的数量