Ngx-infinite-scroll: infiniteScrollDistance calculate wrong

Created on 9 May 2018  路  5Comments  路  Source: orizens/ngx-infinite-scroll

When infiniteScrollContainer is empty, the infiniteScrollDistance calculate wrong.

Expected Behavior

In the demo link "https://plnkr.co/edit/DrEDetYnZkFxR7OWWrxS?p=preview",

The Expected Behavior is "should add the next 20 items when scroll to 90% position."

Actual Behavior

The Actual Behavior is "add the next 20 items when scroll to almost 70% position"

Possible Solution

It seems that the scrolledUntilNow add height twice.

shouldFireScrollEvent in ngx-infinite-scroll/src/services/scroll-resolver.ts
const scrolledUntilNow = container.height + container.scrolled;

calculatePointsForWindow in ngx-infinite-scroll/src/services/position-resolver.ts
// scrolled until now / current y point const scrolled = height + getElementPageYOffset( getDocumentElement(isWindow, container), axis, isWindow );

Your Environment

  • [x] Version used: 0.8.4
  • [x] Browser Name and version: Chrome
  • [x] (Optional) Operating System and version (desktop or mobile): Win10 desktop
investigating

Most helpful comment

+1, I seem to have the same problem with scrollDown. I am setting infiniteScrollDistance to 0 but the onScroll event is triggered before I reach the bottom of the container.

Removing the height from the addition in shouldFireScrollEvent looks like it fixes it.

All 5 comments

Hi,

I have same problem now with scrollDown.
Did #282 correct only scrollUp ?

In my case :

  • infiniteScrollContainer - empty
  • scrolledUntilNow add 2 time height (_calculatePointForWindow_ AND _shouldFireScrollEvent_)

Consequently the event _scrolled_ (with _shouldFireEvent=true_) is fire nearly immediatly after first scroll (_remaining_ is negative)

+1, I seem to have the same problem with scrollDown. I am setting infiniteScrollDistance to 0 but the onScroll event is triggered before I reach the bottom of the container.

Removing the height from the addition in shouldFireScrollEvent looks like it fixes it.

How did you fixed it?

Replaced const scrolledUntilNow = container.height + container.scrolled; by const scrolledUntilNow = container.scrolled; in the shouldFireScrollEvent function here:
https://github.com/orizens/ngx-infinite-scroll/blob/master/src/services/scroll-resolver.ts

Seems to work for me so far but not sure it's the perfect fix.

Can this fix be ported to version that supports angular 4? We are using version 0.8.4 and we need this fix.

Was this page helpful?
0 / 5 - 0 ratings