Ng-zorro-antd: Add scroll listener to nz-table

Created on 13 Feb 2019  ·  4Comments  ·  Source: NG-ZORRO/ng-zorro-antd

What problem does this feature solve?

NzTable doens't expose (scroll) from table. This feature will expose (scroll).

When working with large data sets the performance of nzTable doesn't cut it. We have a view with 200 rows and 20 columns, and each entry has a checkbox. I guess this isn't standard use of nzTable, we've used nzTable before with smaller data sets and it works fine. But for this use-case I need to know where in the table the user is, so that I can do some performance enhancements with my dataset.

What does the proposed API look like?

 <nz-table
      ...
      (nzScroll)="scrolled($event)">...

scrolled({x: number, y:number}) {
       ...
}

By exposing the location of the view I can reduce draw events for data that isn't displayed. It will also enable dynamic loading when I would want to prefetch data in advance.

Table

Most helpful comment

we will support virtual scroll in the next version.
you can check the preview of it here
https://5c70006a50d1090008d52d92--ng-zorro-master.netlify.com/components/table/en#components-table-demo-virtual

All 4 comments

we will support virtual scroll in the next version.
you can check the preview of it here
https://5c70006a50d1090008d52d92--ng-zorro-master.netlify.com/components/table/en#components-table-demo-virtual

I think expose (scroll) from table is also necessary for some situation, as for using NextToken params to make pagination , onScroll can be used for loading next page.

@charlescc has CdkVirtualScrollViewport been sufficient for you? I'm looking around at what is the better solution to avoid having massive (10000+ elements) arrays in memory after the user keep scrolling down.

EDIT: version problem, solved.

And btw, I'm still not natively able to find the field cdkVirtualScrollViewport.
image

Was this page helpful?
0 / 5 - 0 ratings