Question

我想知道是否有人知道一种更有效的方法来显示/隐藏由angularjs驱动的表中的列：

我有一个大表（20多列，100万行），并实现了一个根据用户首选项显示/隐藏列的功能。我在每个表格单元格上通过ng-if执行此操作。这会在桌面的初始加载时触发大量观察者计数，并且角度摘要周期变得疯狂，单个页面上有超过4000个观察者。

解决性能问题的主要想法是减少观察者数量。为此，我使用this库，不执行任何其他操作，然后禁用不在视口中的观察者。到目前为止这么好，性能变得更好，但是如果我要在桌面上添加越来越多的功能呢？看起来这个显示/隐藏列功能将永远是我的性能瓶颈（并且根据chromeJS消化时序分析而言）。

结论：由于观察者数量多，性能差，ng-if看起来不是显示/隐藏列的好方法。有人知道更明智的解决方案来显示/隐藏列吗？

编辑：我已经有每页200行的分页，但问题仍然存在，当然我的目标是提供可扩展的解决方案。

Answer 1

您可以尝试使用应用于所有表格单元格的CSS类以及具有不同类名的相应标题单元格。

EG：第1列，第2列等

在角度字符串中定义类定义，并将样式标记置于表达式

之间

EG：

在控制器js

中

<style>
{{columnStyleDefs}}
</style>

当用户更改其偏好时，您可以根据需要选择“columnStyleDefs”

在html模板中

{{1}}

我回家可能会帮助您完成上述任务。