在 angular 的表中呈现数据的最佳方式
best way to render data in tables in angular
我正在尝试将 table 形式的数据呈现到 angular 中的前端，到目前为止我已经使用了 ng-grid 和 ui-grid。
但它们似乎会降低性能，因为行数更多，有时每个网格 200 多行，单页上有 20 多个网格。
所以浏览器大部分时间挂了我只需要显示数据不需要对数据进行任何操作。它只需要渲染。
因此，如果您有任何其他想法以网格形式呈现这么多数据，请提供帮助。
在您的网格行中使用一次性绑定。 {{::data.id}}。这将提高您的页面性能，因为在第一次绑定完成后手表将被删除。
但是请记住，如果您更改了模型中的任何更改，当您使用一次性绑定时，您将无法在视图中看到它们。
Angular1.3 中引入了一次性绑定。我使用的是 Angular 1.3 或以上版本。
如果您使用的是低于 1.3 的版本，那么您可能需要更改设计。与其显示超过 20 个网格，不如一次只显示一个基于 select 下拉列表的网格。
您也可以尝试 ng-table 指令。但是，如果您使用 20 个超过 200 行的网格，即使这样也会变慢。
Angular 如果手表超过 2000 块，应用程序会变慢。在您的情况下，有 20 * 200 = 4000 块手表。如果您有更多的网格和行，请更加注意。所以最好更改您的设计或使用一次性绑定。
在 ui-grid.
中有几个选项可以解决这个问题
ui-grid 中有一个选项用于 flatEntityAccess，可以通过绑定提高性能。
许多人将他们的网格放在选项卡中，并在选项卡周围使用 ng-if，以便它仅在该选项卡处于活动状态时呈现网格。
如果您需要页面下方列表中的所有网格，可能并非所有网格都同时对用户可见（您不可能有 20 个网格都可见，可能只有一两个可见一次。您可以潜在地检测页面滚动并在网格上使用 ng-if，以便只呈现那些实际可见的内容。
最终的问题是，如果您在每个网格中有 10 列和可能 15 行可见，那么每个网格立即有 150 个观察者，如果您有 20 个网格，您的页面上就有 2000 多个观察者，并且所有每当您滚动任何网格时，都必须评估其中的一个。请注意，每个网格的观察者与可见行数、可见列数以及呈现的网格数相关。如果你想让它运行得更快，最终你需要改变其中一个元素。
最后，您可能需要检查版本 - rc20 甚至当前的不稳定版本都比旧的候选版本更快。
我正在尝试将 table 形式的数据呈现到 angular 中的前端，到目前为止我已经使用了 ng-grid 和 ui-grid。
但它们似乎会降低性能，因为行数更多，有时每个网格 200 多行，单页上有 20 多个网格。
所以浏览器大部分时间挂了我只需要显示数据不需要对数据进行任何操作。它只需要渲染。
因此，如果您有任何其他想法以网格形式呈现这么多数据，请提供帮助。
在您的网格行中使用一次性绑定。 {{::data.id}}。这将提高您的页面性能，因为在第一次绑定完成后手表将被删除。
但是请记住，如果您更改了模型中的任何更改，当您使用一次性绑定时，您将无法在视图中看到它们。
Angular1.3 中引入了一次性绑定。我使用的是 Angular 1.3 或以上版本。
如果您使用的是低于 1.3 的版本，那么您可能需要更改设计。与其显示超过 20 个网格，不如一次只显示一个基于 select 下拉列表的网格。
您也可以尝试 ng-table 指令。但是，如果您使用 20 个超过 200 行的网格，即使这样也会变慢。
Angular 如果手表超过 2000 块，应用程序会变慢。在您的情况下，有 20 * 200 = 4000 块手表。如果您有更多的网格和行，请更加注意。所以最好更改您的设计或使用一次性绑定。
在 ui-grid.
中有几个选项可以解决这个问题ui-grid 中有一个选项用于 flatEntityAccess，可以通过绑定提高性能。
许多人将他们的网格放在选项卡中，并在选项卡周围使用 ng-if，以便它仅在该选项卡处于活动状态时呈现网格。
如果您需要页面下方列表中的所有网格，可能并非所有网格都同时对用户可见（您不可能有 20 个网格都可见，可能只有一两个可见一次。您可以潜在地检测页面滚动并在网格上使用 ng-if，以便只呈现那些实际可见的内容。
最终的问题是，如果您在每个网格中有 10 列和可能 15 行可见，那么每个网格立即有 150 个观察者，如果您有 20 个网格，您的页面上就有 2000 多个观察者，并且所有每当您滚动任何网格时，都必须评估其中的一个。请注意，每个网格的观察者与可见行数、可见列数以及呈现的网格数相关。如果你想让它运行得更快，最终你需要改变其中一个元素。
最后，您可能需要检查版本 - rc20 甚至当前的不稳定版本都比旧的候选版本更快。