Hi,
I am very much new to Ionic2 and trying to use Infinite Scroll with a web service using provider. Its working fine however i am not able to stop it if there is no data. I am following Ionic2 documentation at https://ionicframework.com/docs/api/components/infinite-scroll/InfiniteScroll/
This is my code in .TS file
doInfiniteGallery(): Promise<any> {
console.log('Begin async operation');
return new Promise((resolve) => {
this.authService.GetGallery(this.Num).subscribe(Result => {this.AvlData=Result.gallery.data;
setTimeout(() => {
for (var i = 0; i < this.AvlData.length; i++) {
this.items.push( this.AvlData[i] );
}
console.log('Async operation has ended');
resolve();
}, 500);
this.Num=this.Num + this.AvlData.length + 1;
}); //subscribe end
})
}
I am using a provider to fetch data from website, this is the code in provider -
GetGallery(count:any)
{
return this.http.get("http://MYDOMAIN.COM/fetch.php?action=imagestitle&start="+count).map(res=>res.json());
}
HTML File code as
<ion-item *ngFor="let item of items">
<ion-row>
<ion-col col-12 col-sm>
<h1>{{item.createdate}}</h1>
<p>{{item.title}}</p>
</ion-col>
</ion-row>
</ion-item>
<ion-infinite-scroll (ionInfinite)="$event.waitFor(doInfiniteGallery())">
<ion-infinite-scroll-content></ion-infinite-scroll-content>
</ion-infinite-scroll>
Problem here is that i am not able to STOP the infinite scroll. I changed the code in HTML as
<ion-infinite-scroll *ngIf="!lastpage" (ionInfinite)="$event.waitFor(doInfiniteGallery())">
<ion-infinite-scroll-content></ion-infinite-scroll-content>
</ion-infinite-scroll>
It worked but that spinner still shows.
I Googled and found that i need to use InfinateScroll.enable(false) however i am not able to put this in correct position inside function, i tried but it’s giving undefined error.
Can anyone please help me out ?
Thanks