Infinite scroll doesn't work correctly on ios

#1

Hy guys,
in my page I have an ion-refresher and also an infinite scroll:

...

<ion-content>
	<ion-refresher (ionRefresh)="refresh($event)">
		<ion-refresher-content></ion-refresher-content>
	</ion-refresher>

    <div>	
	
        <div class="image__square" *ngFor="let photo of photos">   
          <img src="..."/>
        </div>
        
        <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
			<ion-infinite-scroll-content></ion-infinite-scroll-content>
        </ion-infinite-scroll>

     </div>		

</ion-content>

...

then in ts file:

...

 refresh(refresher) {

    this.getEvent()  --> getEvent returns and populates a variable event...
     .then(
        () => {
          refresher.complete();  
        }
      );       
  }

...

doInfinite(infiniteScroll) {

    setTimeout(() => {
  
      this.photoService.getPhotosEvent(this.event).then(
        (contents) => {       

          contents.forEach(photo => {
            this.photos.push(photo);

          });

        },
        (error) => {
         
        }
      );

      infiniteScroll.complete();
    }, 500);
}

In a few words I have a refresher to get again the first part of the photos of the event. And at the end I have an inifite scroll

My issue is on iOS device: when I pull down to refresh, or I reached the inifinite scroll, the loading img (I mean the spinner of the inifinite scroll) is shown for ever… it’s never hide…

What I wrong :frowning:
Thanks

#3

are you calling infiniteScroll.complete() once the loading is done?
And if there are no more items, disable the infiniteScroll

#4

Hi nirman99,
the post is very old, but I appreciate your help!!!

I solved it, in the same way you suggested here, months ago.

The problem was that I didn’t disable the scroll.

Anyway, thanks for all! :wink: