Data Scroller infinite scroll

[MarkL]

Hi, I am trying to figure out out to get infinite scrolling working with data scroller but I don't understand how it works from the documentation.
It seems as though each time I scroll the (onLazyLoad) event should get triggered and call my function where I can then use $event to request data from my REST server, but my function only gets called once when the page first loads.

Code: Select all

<p-dataScroller [value]="values" [rows]="10" [paginator]="true" (onLazyLoad)="loadData($event)" [lazy]="true">

Can anyone please tell me what I'm missing or elaborate on how to implement infinite scrolling with data scroller? Thanks

[cagatay.civici]

Do you want to use the scroller of windows or a particular element. Is scrollbar displayed on page load after first execution of load data?

[MarkL]

I would like to have the scroller on the <p-dataScroller> element. The scrollbar is displayed but it takes a couple of seconds to load the data as there are 1000 items being loaded

[cagatay.civici]

So to confirm, it is inline scroller like;

http://www.primefaces.org/primeng/#/datascrollerinline

But you want it infinite right?

[MarkL]

Yeah exactly

[DarthMaul]

Hi MarkL,

In our live showcase you can add [inline]="true" scrollHeight="500px" to the Datascroller-Infinite and that's what you want.

http://www.primefaces.org/primeng/#/dat ... erinfinite

[MarkL]

Thanks, I have the infinite scrolling working now. However I am having a problem where the further down I scroll the more it starts to lag and take time to load the rows.
I am making a request to a remote server, and each row is only 10.8kb.

Anyone experience this before or have idea why this is happening?

[cagatay.civici]

I remember that this is a known performance issue of ngFor that we use internally to display rows. I hope that Angular2 team will provide a more efficient ngFor maybe one that does not track changes because I guess it keeps track of changes so causing performance issues for large datasets.

[MarkL]

Ok but how come it works fine in the showcase no matter how far down I scroll?
I tried doing a similar implementation using local data but still experiencing the same problem.

[cagatay.civici]

Do you scroll for 1000+ rows in showcase? Showcase loads 10 rows each time.