ionic

<ion-content ng-controller="MyController">   
    <ion-infinite-scroll     on-infinite="loadMore()"     distance="1%">   
    </ion-infinite-scroll> 
</ion-content>
function MyController($scope, $http) {   
    $scope.items = [];   
    $scope.loadMore = function() {     
    $http.get('/more-items').success(function(items) {       
        useItems(items);      
    $scope.$broadcast('scroll.infiniteScrollComplete');//广播通知数据加载完成    
 });  
  };  
  //接受广播消息
 $scope.$on('stateChangeSuccess', function() {     $scope.loadMore();   }); }

当没有更多数据加载时,就可以用一个简单的方法阻止无限滚动,那就是angular的ng-if 指令:

<ion-infinite-scroll   ng-if="moreDataCanBeLoaded()"   icon="ion-loading-c"   on-infinite="loadMoreData()"> </ion-infinite-scroll>

当 icon="ion-loading-c" 无效果时,可是用 refreshing-icon="ion-loading-c"

<ion-content ng-controller="MyController">   
   <ion-refresher pulling-text="Pull to refresh" refreshing-text="Loading..." refreshing-icon="ion-loading-c" pulling-icon="ion-ios7-arrow-thin-down" on-refresh="doRefresh()"> </ion-refresher> 
</ion-content>
function MyController($scope, $http) {   
    $scope.doRefresh = function() {     
    $http.get('/more-items').success(function(items) {       
        //TODO:  
    $scope.$broadcast('scroll.refreshComplete');//广播通知数据刷新完成    
 });  
  };
  //接受广播消息
  $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){ 
    // logic})

PS:

//广播消息,通知上推加载更多的代码执行完毕
$scope.$broadcast('scroll.infiniteScrollComplete');


你可能感兴趣的:(ionic,ion-refresh)