ionic实现上拉到底内容提示
<!--html代码--> <ion-content has-bouncing = true on-drag-up="scrollDragUp()"> <div class="content"> <list-item></list-item> </div> <ion-infinite-scroll on-infinite="onInfinite()" ng-if="!noMoreItems" distance="1%"><i>正在加载数据</i></ion-infinite-scroll> </ion-content>
//js代码 var isShowNomore = false; $scope.scrollDragUp = function() { var currentTop = ionicScrollDelegate.getScrollPosition().top; var maxTop = ionicScrollDelegate.getMaxTop(); if (currentTop - maxTop > 50 && maxTop > 0) { //说明可以提示了 if (!isShowNomore && scope.noMoreItemsAvailable) { isShowNomore = true; scope.infiniteData = "已经到底啦!"; $(".infinite-data").show(); setTimeout(function() { $(".infinite-data").hide(); isShowNomore = false; }, 700); } } }