ngx-infinite-scroll icon indicating copy to clipboard operation
ngx-infinite-scroll copied to clipboard

Published 20 hours ago • verified publisher icon orizens

infiniteScrollDistance calculates wrongly

Open ganqqwerty opened this issue 6 years ago • 5 comments

Expected Behavior

I expect for infiniteScrollDistance=0 to be fired only when I get to the last element, for example the 100th element in this stackblitz: https://stackblitz.com/edit/ngx-infinite-scroll-grlzan?file=src%2Fapp%2Fapp.component.html

however the scroll is triggered when I'm on element 75.

Similarly, if I change infiniteScrollDistance to 1, I expect the scroll to be triggered when I see the 90th element, but it's triggered when I see 66th element.

Your Environment

  • [ ] Version used: 7.0.0
  • [ ] Browser Name and version: Chrome 73.0.3683.86 (Official Build) (64-bit)
  • [ ] (Optional) Operating System and version (desktop or mobile): OS X 10.13.6 (17G65)

ganqqwerty avatar Apr 11 '19 11:04 ganqqwerty

@ganqqwerty - that happens because the calculation of the scroll takes into an account the trackbar's height.

orizens avatar Apr 11 '19 15:04 orizens

Do you think it's possible to specify the parameter that would lead to the behaviour I described? That is, the loading of the new elements should be loaded only when the bottom of the scrollbar will touch the bottom of the screen. image

ganqqwerty avatar Apr 12 '19 09:04 ganqqwerty

@ganqqwerty i do believe it's possible - and it requires a thought and development. I encourage you to open a pr if you feel comfortable and i'm willing to add this as an input property.

orizens avatar Apr 14 '19 23:04 orizens

@orizens I think I got what was going on. I was experimenting with ngx-infinite-scroll being applied on a scrollable div and compared its behaviour with the case where we scroll the whole window.

Let's say the infiniteScrollDistance=0, it's an easy case.

Currently if the container is not window, the infinite scroll works as expected: the loading happens only when the bottom of a scrollbar touches the bottom of the container.

However if the container is window, the behaviour is different. The loading happens earlier, even though infiniteScrollDistance is 0.

From what I understood from the code of the plugin, in case of window the loading happens when the bottom is windowHeight pixels away.

For our application we only use ngx-infinite scroll with window being a container, so I just changed a formula a bit.

However I want this improvement to be included into the library, so I will make it conditional.

ganqqwerty avatar Apr 18 '19 12:04 ganqqwerty

Please see the pull request

ganqqwerty avatar Apr 18 '19 14:04 ganqqwerty