ionic上拉加载更多解决方法

来源:互联网 发布:儿童摄影网络推广 编辑:程序博客网 时间:2024/04/28 15:56


第一步: $scope.hasmore = true;//是否允许上拉加载
$scope.num = 8;//显示条数

第二步://查询显示内容,查出所有的

$scope.Group = function () {         

$http({            

url: Storage.get("Visiturl") + 'api/XXXX.ashx',

            method: 'post'        

}).success(function (data, header, config, status) {             //响应成功

        if (data != "") {            $scope.contents= data;            return;        } else {            return;        }    }).error(function (data, header, config, status) {        //处理响应失败        $scope.err_txt = '出错了,请稍后再试';        return;    });    }    $scope.Group();第三步: ng-repeat="content in contents| limitTo: num"//循环显示多少条,num为显示几条,已在js中定义8条第四步: <ion-infinite-scroll ng-if="hasmore" immediate-check="false" on-infinite="loadMore()" distance="1%"></ion-infinite-scroll>//hasmore为是否允许上拉加载更多,loadMore为上拉时执行的方法

第五步:$scope.loadMore = function () {           

  if ($scope.num > $scope.gps.length) {//显示数量大于总数不让上拉加载

$scope.hasmore = false;            

} else {

//否则显示数量为当前显示数量加8条

$scope.num = $scope.num + 8;            

}

$scope.$broadcast('scroll.infiniteScrollComplete');//关闭上拉加载动画

}

0 0
原创粉丝点击