ionic指令ion-content和指令ion-infinite-scroll实现上拉加载分页功能

代码如下：

<ion-content ng-if="tab1">
        <div ng-repeat="item in lists track by $index">
            ..................
       </div>
       <ion-infinite-scroll ng-if="hasMore" on-infinite="loadMore()" immediate-check="false" distance="2%"></ion-infinite-scroll>
  </ion-content>

上述代码会有一个问题：

由于一个页面有多个tab，切换tab加载不同的列表，如果在ion-content使用ng-if指令，则列表不能滚动。去掉ng-if后可以滚动，由于每个tab列表不一样，每个item显示样式也不一样，需要做区分。

解决办法：

在<ion-content>里层包一个div标签，在div上使用ng-if做区分，如下：

<ion-content>
        <div ng-if="tab1" ng-repeat="item in lists1 track by $index">
            ..................
       </div>   
       <div ng-if="tab2" ng-repeat="item in lists2 track by $index">
            ..................
       </div>   
    <ion-infinite-scroll ng-if="hasMore" on-infinite="loadMore()" immediate-check="false" distance="2%"></ion-infinite-scroll>
</ion-content>

问题2：上拉分页加载时，触发多次加载请求，

解决办法：网上很多人说加上immediate-check="false"，然而不起作用，

$scope.loadMore = function(){
    $http(...).then(function(res){
        if(res.data.length<=10){
          $scope.hasMore = false;
        }else{
          $scope.hasMore = true;
        }
        $scope.$broadcast('scroll.infiniteScrollComplete');  
    });
    $timeout(function () {  
         $scope.$broadcast('scroll.infiniteScrollComplete');  
     }, 1000); 
}