延迟加载带过滤的项目

时间:2012-07-19 01:02:15

标签: javascript search backbone.js infinite-scroll

我正在使用Backbone.js在页面上一次加载20个项目,当您向下滚动到底部时,获取更多项目,直到没有剩余的项目从服务器获取。

与此同时,我想要一个输入字段,当您输入名称时,它会过滤匹配的项目。

问题是,如果您尚未滚动到底部并获取完整集,则输入过滤器将仅匹配页面上当前的项目。

将UI过滤与延迟加载的项目相结合,在技术上和视觉上最好的解决方案是什么?

编辑: 这里的真实情况是加载你所有的Facebook朋友,这可能非常慢,并与其他api混搭。我不想一次加载,因为经验被延迟了。

1 个答案:

答案 0 :(得分:1)

当用户搜索时,为什么不使用包含过滤器的fetch重置集合?

Collection.fetch({term:$(“#search”)。val()})

如果您为此集合设置后端API端点,以使用术语params来调整结果的范围,那么您的集合将仅包含来自服务器的与用户输入匹配的结果。

您还可以将初始提取限制为用户输入的前3个字符,然后在继续输入时执行其余的过滤客户端。也就是说,如果您没有在第一次通话时限制搜索结果服务器端。