CODEWITHSUNDEEP
angularionic-framework
user5954642
user5954642

Reputation:

Ionic 3 Infinite Scroll End When No More Data Is Found

I am using json to data and what I want to do is I need to end infinite scroll once no more data is available. How can I implement this. Here is the code -

    loadData(currentCount) {
    this.http.get('http://www.exapmle.com/feed.php?page=' + this.currentCount).map(res => res.json()).subscribe(data => {
        this.posts1 = data;
        let i = 0;
        for (let v in this.posts1) {
            if (i < 4) {
                this.slidesdata.push(this.posts1[v]);
            } else {
                this.posts.push(this.posts1[v]);
            }
            i++;
        }
    });
}

    doInfinite(infiniteScroll: any) {
    this.currentCount = this.currentCount + 1;
    this.http.get('http://www.exapmle.com/feed.php?page=' + this.currentCount).map(res => res.json()).subscribe(data => {
        this.newposts1 = data;
        this.newposts = this.newposts1;
        for (let i in this.newposts) {
            this.posts.push(this.newposts[i]);
        }
        infiniteScroll.complete();
    });
}

Upvotes: 0

Views: 5479

Answers (1)

Swapnil Patwa
Swapnil Patwa

Reputation: 4089

Use *ngIf.

HTML:

     <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
            <ion-infinite-scroll-content loadingText="Loading your leads..." *ngIf="pagingEnabled"></ion-infinite-scroll-content>
        </ion-infinite-scroll> 
<div *ngIf="!pagingEnabled"> No more data is available.</div>

TS

public pagingEnabled: boolean = true;

 doInfinite(infiniteScroll: any) {
      this.currentCount = this.currentCount + 1;
      this.http.get('http://www.exapmle.com/feed.php?page=' + this.currentCount).map(res => res.json()).subscribe(data => {
          this.newposts1 = data;
          this.newposts = this.newposts1;  
          if (this.newposts.length) {
              for (let i in this.newposts) {
                  this.posts.push(this.newposts[i]);
              }
          } else {
              this.pagingEnabled = false;
          }

          infiniteScroll.complete();
      });
  }

Upvotes: 2

Related Questions