ionic3上拉刷新，下拉加载

上拉刷新：ionRefresh

<ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content pullingIcon="arrow-down"
           pullingText="下拉刷新"
           refreshingSpinner="circles" 
           refreshingText="数据加载中...">
    </ion-refresher-content>
  </ion-refresher> 

js代码：

  doRefresh(refresher) {
    this.getDataList(); //重新调用getDataList方法，获取数据
    refresher.complete();
  }

下拉加载： InfiniteScroll
The Infinite Scroll allows you to perform an action when the user scrolls a specified distance from the bottom or top of the page.

The expression assigned to the infinite event is called when the user scrolls to the specified distance. When this expression has finished its tasks, it should call the complete() method on the infinite scroll instance.

页面代码：
<ion-content>
 <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>
</ion-content>
js代码：
@Component({...})
export class NewsFeedPage {
  items = [];

  constructor() {
    //模拟首次进入页面，加载数据
    for (let i = 0; i < 30; i++) {
      this.items.push( this.items.length );
    }
  }

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

    setTimeout(() => {
      //模拟执行加载，向页面追加数据
      for (let i = 0; i < 30; i++) {
        this.items.push( this.items.length );
      }

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

}