Scrolling like facebook(infinite scroll)


#1

hello guys,
i am new in ionic 2.
Facing problem with infinite scroll.

my API looks like this:
…myservice?pageNum=1&pageSize=5

page no should be 1,2,3 as on call(on scroll down)
pageSize is the data(count) showed on a page
i have tried ionic infinite scroll but failed

please help how to use infinite scrolling
thanks


#2

please share your code.


#3

Here is my code:
page.Html:

service.ts:

attendancePane(pageSize) {
    return new Promise(resolve => {

      this.http.get("…myApi?pageNum"=+"1"+"&pageSize="+"pageSize")
        .map(res => res.json())
        .subscribe(
        data => { resolve(data) },
        err => { console.log(err) }
        );

    });
  }


<ion-list>
   <ion-item *ngFor="let i of items">{{i}}</ion-item>
 </ion-list>

<ion-infinite-scroll (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content></ion-infinite-scroll-content>
  </ion-infinite-scroll>

page.ts:

AttendancePanelist() {
      this.storage.get('token').then((value) => {
        this.userProvider.attendancePane( this.pageNum).then(data => {
          this.paneList = JSON.parse(JSON.stringify(data));
        });
    })
  }


doInfinite(infiniteScroll) {
    console.log('Begin async operation');

    return new Promise((resolve) => {
      setTimeout(() => {
        for (var i = 0; i < 30; i++) {
          this.paneList.push( this.paneList.length );
        }

        console.log('Async operation has ended');
        resolve();
      }, 500);
    })
  }

now problem is ‘pageNum’ will change on every ‘doInfinite()’ call (default 1 then 2 then 3 …)
how i can do that. please help.

thanks