使用Angular填充大数组列表以下拉

时间:2015-05-29 05:56:14

标签: javascript angularjs

我正面临一个问题。我有一个大小约22K记录的对象集合。我需要将它绑定到一个select元素。绑定适用于小型集合,但是这样一个大集合正在冻结UI,直到它完全绑定。

请建议我能做的最好的事情......

2 个答案:

答案 0 :(得分:3)

首先想到的是使用one-way data binding。这是通过在您的HTML变量前添加::来实现的,如此

{{::someVar}}

这样,角度不会在someVar中包含watchers

如果这还不够,那么您可以考虑为自己的目的编写一种特殊类型的select,它可以使用ClusterizeJS之类的内容。

ClusterizeJS只允许在屏幕上渲染一些元素并在滚动时重新渲染,以便用户永远不会知道select中不存在所有元素。将此与search bar结合使用,您就可以快速select

答案 1 :(得分:2)

一般来说,填充具有如此大量记录的<select>元素是不明智的。无论您使用哪种框架,这都适用(尽管Angular和双向数据绑定会特别糟糕)。

如果您希望用户能够从大量选项中进行选择,我建议使用“自动完成”样式的界面,其中用户键入几个字符,客户端提取的内容与他们键入的内容相匹配到目前为止。

例如,您可以使用Angular-UI select