ionic 下拉刷新，上拉加载更多

Posted 2020-08-20 Tiac

1）下拉刷新用的是 ion-refresher，使用示例如下：

<ion-refresher
     pulling-text="Pull to refresh..."
     on-refresh="doRefresh()">
</ion-refresher>

详情说明请看官方文档：http://ionicframework.com/docs/api/directive/ionRefresher/

刷新后需要收起 loading 动画

 

$scope.$broadcast(‘scroll.refreshComplete‘);  

 

2）上拉加载用的是 ion-infinite-scroll，使用示例如下：

<ion-infinite-scroll
    on-infinite="loadMore()"
    distance="1%">
</ion-infinite-scroll>

详情说明请看官方文档：http://ionicframework.com/docs/api/directive/ionInfiniteScroll/

加载完之后需要收起 loading 动画

 

$scope.$broadcast(‘scroll.infiniteScrollComplete‘);

 

 

 

PS:需要注意的是这两个功能标签都是需要写在 ion-content 标签里的，不然会出错