Infinite scroll: have to scroll up and down

We´re using infinite scroll and I can´t fix the problem that I have to scroll up and down. The load more function will start only when I scroll up and then down:

   constructor(private itemService: ItemService) {
        this.loadItemsForInfinite();
    }

   // Infinite scroll: load items
    loadItemsForInfinite(event?) {
        this.itemService.getItems(this.searchTerm)
            .subscribe(res => {
                this.items$ = this.items$.concat(res.items);

                if (this.items$.length >= this.itemsCount$) {
                    this.items$.length = this.itemsCount$;
                }
                if (event) {
                    event.target.complete();
                }
            });
    }

    // Infinite scroll: more items after index 20
    loadMoreItems(event) {
        if (this.items$.length >= this.itemsCount$) {
            event.target.disabled = true;
        } else {
            this.index = this.index + 20;
            this.loadItemsForInfinite(event);
        }
    }

Any idea what could be my mistake?

Have you any idea why my infinite scroll doesn´t work correctly?

@iondo
I still have a hard time detecting unusual behavior in the video.

Were you enough of the official documentation to implement it?

Exactly: What are you waiting for and what is it doing?

Sorry, my explanation wasn´t good anough!

When I reach the end of the list I don´t get more list items automaticly. I have to scroll up and down to trigger the loadMore function.
You know what I mean?

That´s not the right behavior.

@iondo What I’m not seeing is the place where you indicate that it has reached the ma length.

I understand that from the server pagination, you should send a: “totalLength”, but what I observe is that you reach and only match the same amount always :confused: