什么是在角形材料数据表中加载> 100k条记录的有效方法[关闭]

Question

关闭。这个问题是off-topic。它当前不接受答案。

---

是否要改善此问题？ Update the question，因此堆栈溢出为on-topic。

[<6天前关闭。

我第一次使用角度材料数据表，所以不确定我是否使用正确的方法。

用例以网格形式显示来自API的记录，我正在使用角度材质数据表通过传递给'dataSource'加载所有数据。

分页，分类和过滤由物料数据表本身完成。

现在当数据越来越多（6万到10万条记录）时，浏览器（chrome）花费了大量时间

我发现的替代方法是服务器端分页（逐页记录需求），但是对于这种排序，必须从服务器支持过滤。有什么方法可以改善将大量数据（超过100k）加载到角度材质数据表中的性能。

Answer 1

我认为您正在寻找虚拟滚动。想法是将100k项加载到内存中，然后仅在屏幕上显示其中的一部分，例如1到20。向下滚动时，组件应推送新闻项（21、22 ...），并从列表中删除第一个新闻项（1、2 ...），反之亦然。实现自己并不是很复杂，但是仍然需要一些工作。您的模板必须遍历X个项目的数组，并且在滚动时，组件必须检测到表格已达到其顶部或底部减去Y像素。然后，它必须在数组的开头和结尾处推送和/或弹出项目，以保持要显示的最大项目数。

[希望有一个库可以将此功能添加到Angular Material数据表中：https://diprokon.github.io/ng-table-virtual-scroll/#/overview