如何使用 mongodb 数据延迟加载角度

Posted 2023-03-07

【中文标题】如何使用 mongodb 数据延迟加载角度

【英文标题】：How to lazy load with angular using mongodb data

【发布时间】：2017-06-20 11:28:20

【问题描述】：

我想在 angular.js 中实现延迟加载，我正在使用 nodejs 将数据列表从后端发送到 UI，我需要在滚动 10 个项目上实现，是否有任何示例可以实现这一点，请分享任何链接去做这个。请任何人都可以帮助我。

【问题讨论】：

使用shabeebk.com/blog/…或无限滚动等指令

最佳教程 youtube.com/… 结帐

【参考方案1】：

延迟加载与 DB 无关，因为它依赖于 DAO 层，而 DB 关心返回提交给它的查询的数据。

我从 UI 实现延迟加载的方法

使用分页我们可以做延迟加载

1) 查找集合中的文档总数

2) 每次加载下一组数据的页面时，传递所需的信息，例如 DB 需要从哪个文档发送数据

3) 重复步骤 2，直到达到集合中的文档总数

一个例子让我们有一个记录很少的集合

db.mycollection.find();

 "_id" : ObjectId("58947e7e93cbb73057657d60"), "name" : "Clement" 
 "_id" : ObjectId("58947e7e93cbb73057657d61"), "name" : "Rockin" 
 "_id" : ObjectId("58947e7e93cbb73057657d62"), "name" : "Gowri" 
 "_id" : ObjectId("58947e7e93cbb73057657d63"), "name" : "Inbaraj" 
 "_id" : ObjectId("58947e7e93cbb73057657d64"), "name" : "Siva" 
 "_id" : ObjectId("58947e7e93cbb73057657d65"), "name" : "Rani" 
 "_id" : ObjectId("58947e7e93cbb73057657d66"), "name" : "Rose" 
 "_id" : ObjectId("58947e7e93cbb73057657d67"), "name" : "Rekha" 
 "_id" : ObjectId("58947e7e93cbb73057657d68"), "name" : "Dev" 
 "_id" : ObjectId("58947f6f93cbb73057657d69"), "name" : "Joe" 
 "_id" : ObjectId("58947f8393cbb73057657d6a"), "name" : "Beniton" 

进行分页的先决条件

db.mycollection.find().count()
11

让我将初始加载大小设为 5

我对 DB 的第一个查询是

db.mycollection.find().sort("_id":1).limit(5);

 "_id" : ObjectId("58947e7e93cbb73057657d60"), "name" : "Clement" 
 "_id" : ObjectId("58947e7e93cbb73057657d61"), "name" : "Rockin" 
 "_id" : ObjectId("58947e7e93cbb73057657d62"), "name" : "Gowri" 
 "_id" : ObjectId("58947e7e93cbb73057657d63"), "name" : "Inbaraj" 
 "_id" : ObjectId("58947e7e93cbb73057657d64"), "name" : "Siva" 

我对数据库的下一个查询

db.mycollection.find().sort("_id":1).skip(5).limit(5);

 "_id" : ObjectId("58947e7e93cbb73057657d65"), "name" : "Rani" 
 "_id" : ObjectId("58947e7e93cbb73057657d66"), "name" : "Rose" 
 "_id" : ObjectId("58947e7e93cbb73057657d67"), "name" : "Rekha" 
 "_id" : ObjectId("58947e7e93cbb73057657d68"), "name" : "Dev" 
 "_id" : ObjectId("58947f6f93cbb73057657d69"), "name" : "Joe" 

最终查询将是

db.mycollection.find().sort("_id":1).skip(10).limit(5);

 "_id" : ObjectId("58947f8393cbb73057657d6a"), "name" : "Beniton" 

在这个例子中，

使用_id排序，它基于插入时间，这有助于我们对文档进行排序并为后续查询呈现。

希望对你有帮助！

参考资料：

https://www.mongodb.com/blog/post/the-mean-stack-mongodb-expressjs-angularjs-and

Lazy Loading/More Data Scroll in Mongoose/Nodejs

http://adrichman.github.io/implementing-a-lazy-load-and-infinite-scroll-in-angularjs/