代码之家 › 专栏 › 技术社区 › Amit

AngularJS-数据表的最佳实践

angularjs

Amit · 技术社区 · 10 年前

我有一张表,包含300行(有限),20列。-带Ag网格

该表也有8个过滤器,每个过滤器是平均50行的多选。-使用isteven多选

这个模块非常慢,Batarang显示了7000到20000美元的观察者。该模块也是系统中最重要的模块。

我更改了过滤器以在需要时动态加载,但仍然非常缓慢。(在Chrome上,具有8核i7和16GB RAM)

显示海量数据的表格的最佳做法是什么?

3 回复 | 直到 10 年前

LJ Wadowski 10 年前

您可以使用一次性数据绑定。在视图中使用 {{::myVal}} 相反 {{myVal}} 它应该减少观察者的数量。

您可以进行延迟渲染或虚拟重复,以减少必须创建的DOM节点的数量。(这可能是你的应用瓶颈)

最后,您可以使用自己的角度编译方法实现,并使用 $eval 用编译自己的模板 $scope 变量,但不将其添加到角度应用程序范围。它可以比角度解决方案快得多,因为您可以避免所有检查,并为您的应用程序优化它,并将其渲染为纯html,而无需任何角度魔法,这将使这一点更快。

Martijn Welker 10 年前

我建议您查看使用虚拟化的网格,如 ui-grid ,您可以找到一个具有大型数据集的示例 here

Mihail Petkov 10 年前

您可以使用 React 为此。React的性能要好得多。反应是 V 在里面 MVC 所以你可以使用React+AngularJS。

您也可以尝试这个AngularJS库- angular-datatables

推荐文章

learner · 如果超出限制,AngularJS ui select multiple应显示警报

4 年前

Onyx · 外部和内部div都有ng click,当我单击内部div时,两个ng click都会执行。如何预防?

4 年前

Michlut · Angular JS——从表单上传文件,并作为json对象的一部分与其他数据一起发送

4 年前

jieunbi · 按日期排序数组(最新优先)

4 年前

StackoverflowNinja · 当数字框的值在AngularJS中更改时更改下拉列表的值

4 年前

Stradosphere · 如何防止ng bind html添加结束标记?

8 年前

Celestialchippy · 如果事情是真的,如何创建一个“<a>”链接?

8 年前

a4aravind · Angulari如何使用java驱动程序访问元素?

8 年前

Nicoleta Wilskon · DecodeURIComponent不支持%uxxx编码的组件

8 年前

Nishant Florentin · 在AngularJS中发生ng if、ng show等之后,我该如何做一些动作?

8 年前