javascript - 无限滚动 ionic 框架:Loadmore() called multiple times

标签 javascript angularjs cordova ionic-framework

我正在使用 ionic 无限滚动从 php api 服务加载数据。

问题在于 on-infinite 属性(即 loadmore 函数)上定义的方法在到达底部时被多次调用。

这是我的代码

<div class="card" ng-repeat="result in results">
 <div>{{result.name}}</div>
</div>
<ion-infinite-scroll immediate-check="false" on-infinite="loadMore()" distance="10%" ng-if="!noMoreItemsAvailable"></ion-infinite-scroll>

这是我的 Controller js

$scope.loadMore=function(){

        console.log("Load more item clicked");
   //get data from api service
   $http.get(url).then(function(msg){
       $scope.results=$scope.results.concat(msg.data)
     });
};

当它到达底部时,我会多次收到控制台消息加载更多点击的项目,有时它会无限次。 有谁知道为什么会这样吗?

最佳答案

从服务获取数据并将其分配给 scope 后调用 $scope.$broadcast('scroll.infiniteScrollComplete');

在这种情况下,调用应该在 $scope.results=$scope.results.concat(msg.data); 之后。

关于javascript - 无限滚动 ionic 框架:Loadmore() called multiple times,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34126977/

相关文章:

javascript - Firestore 中的查询删除正在删除所有内容,如何解决?

javascript - q$ Angular 用于非阻塞循环

javascript - Angular JS CSS 双向更新

android - 使用 Eclipse 测试 PhoneGap 应用程序时不断收到 "A network error occurred"

javascript - meteor -Cordova :How To add permissions?

javascript - Rails - 莫里斯图表未出现

javascript - 通过 MS Excel WebApp 中的 Office 脚本调用 API

cordova - Phonegap和Phonegap Build之间的区别?

javascript - 如何确保 jQuery 中的 onclick 事件适用于该类新更新的元素?

javascript - AngularJS 通过服务传递数据,但在页面刷新时丢失数据