3

你好呀!

我需要使用 Angular 2+ 创建一个包含这么多记录的表。为此,我正在尝试虚拟滚动。尽管如此,我还是找不到任何处于工作状态的文档或样本。

请帮助我开始使用 Angular 2+ 虚拟滚动。

4

3 回答 3

1

我强烈推荐ngx-virtual-scroller

它非常强大,可以轻松处理成千上万个复杂元素。我在我的开源视频中心应用程序中使用它来显示图像和视频库(自定义元素),允许用户更改列数。有关代码,请参见GitHub

于 2019-07-31T23:46:56.243 回答
1

你可以试试ngx-ui-scroll。它提供*uiScroll了可以直接在您的 App 组件模板中使用的结构指令。它目前(v0.0.4)不支持表格布局,但如果你可以使用 div 布局,它可能看起来像

<div class="viewport">
  <div *uiScroll="let item of datasource" class="row">
    <div class="col1">{{item.data1}}</div>
    <div class="col2">{{item.data2}}</div>
    <div class="col3">{{item.data3}}</div>
  </div>
</div>

然后您需要根据演示页面Datasource中的文档或代码示例来实现该对象。

于 2018-05-03T18:40:25.220 回答
0

你应该看看 Angular Material VirtualRepeat https://material.angularjs.org/latest/demo/virtualRepeat

md-virtual-repeat 指令提供了一个 md-on-demand 属性,可避免将数组作为数据源提供者。

[编辑] Angular Material VirtualRepeat 尚不适用于 angular2,我对 rintoj/angular2-virtual-scroll 进行了一些更改,以从后端而不是从数组中获取数据。它在 github 上https://github.com/pnocera/ng2-vscroll

于 2017-03-08T12:49:53.737 回答