Infinite scroll not scrolling

#1

Hi everyone,

I am working with the component infinite scroll and sometimes it doesn’t work (don’t appear and scroll) when I know there are more results to show.

What can be happening?

Thank you very much in advance.

#2

Does the console show any errors?

in your .ts should add this

doInfinite(infiniteScroll) {
this.page++;
this.infiniteScroll = infiniteScroll;
this.carregarFilmes(true); // your function for
load more itens
}

in your .html should add this

<ion-infinite-scroll (ionInfinite)=“doInfinite($event)”>

<ion-infinite-scroll-content></ion-infinite-scroll-content>

</ion-infinite-scroll>

within its function of loading items, you must put another to display the loading image and when you load the items, you call another function to close the loading.

1 Like
#3

Thank you so much for your response Lucas098.

In my .ts I have something like this:

infiniteScrollLoadingData(infiniteScroll: InfiniteScroll) {
    if (this.list.length >= this.resultsNumber) {
      infiniteScroll.enable(false);
    } else {
      this.queryProvider.query(this.navParams.data.criteria, false).subscribe(
        (response: any) => {
          response.extractList.forEach((element) => {
            this.list.push(element);
          });
          this.navParams.data.criteria.page = this.navParams.data.criteria.page + 1;
          this.content.resize();
          infiniteScroll.complete();
        },
        (error) => {
          console.log("Error! -->", error);
        }
      );
    }
  }

And my .html is something like this:

<ion-infinite-scroll (ionInfinite)="infiniteScrollLoadingData($event)" threshold="5%">
  <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="{{'app.loadingData' | translate}}"></ion-infinite-scroll-content>
</ion-infinite-scroll>

The infinite scroll is inside an ion-content after an ion-grid.

The problem is that sometimes the page does not recognize the infinite scroll. I also have to say that the page have its own scroll and this infinite scroll.

Thank you so much.