如何从最初的触发后被多次触发prevent ngInfiniteScroll？ [英] How to prevent ngInfiniteScroll from being triggered multiple times after the initial trigger?

问题描述

我使用ngInfiniteScroll，使我的网站上无限滚动。它的工作原理部分原因是预期，一旦我滚动到页面的底部，它调用我想它来调用，显示更多内容，除了它不断给你打电话的帖子没有结束它被触发一次之后方法。有谁知道这可能是导致此？这就是我的code看起来像我在哪里实施ngInfiniteScroll，我不知道这具体code将帮助不大，但。我怀疑这是在另一个文件中得到揭去由code。

 ＆LT; D​​IV的风格=高度：1px的＆GT;
＆LT;后后项=项目饲料项=items.feed饲料-NAME =feedNameNG重复=，在items.feed项目＆GT; ＆LT; /后＆GT;
＆LT; D​​IV NG-IF =items.feed.length == 0安培;＆安培;！initialLoad＆GT;
＆LT; D​​IV CLASS =空消息＆GT;您的饲料目前是空的，请在＆lt; A HREF =/＃/用户＆GT;用户＆LT; / A＆GT;页面并找到了一些更多的人效仿＆LT;！/ DIV＆GT;
＆LT; / DIV＆GT;
＆LT;一个无限滚动=nextPosts（）无限滚动的距离=1HREF NG点击=nextPosts（）级=节目，更＆gt;显示详情＆lt; / A＆GT;
＆LT; / DIV＆GT;
 

解决方案

例 < BR>
您可以使用 ngInfiniteScroll 的无限滚动禁用指令，告诉它不会加载数据呼叫是否已经正在进行中

例如

 ＆LT; D​​IV无限滚动='loadMore（）'无限滚动功能='busyLoadingData'无限滚动的距离='1'＆GT;
  ＆LT; p NG重复= GT中的项项;有些数据与LT; / P＆GT;
＆LT; / DIV＆GT;
 

JS：

  $ scope.busyLoadingData = FALSE;$ scope.loadMore =功能（）{
  如果（$ scope.busyLoadingData）回报;
  $ scope.busyLoadingData =真;  // $ HTTP调用来获得下一组数据
  //在.success（）回调做$ scope.busyLoadingData = FALSE;
}
 

I am using ngInfiniteScroll to enable infinite scrolling on my website. It works partly as expected, once I scroll to the bottom of the page it calls the method I want it to call to show more posts, except that it keeps calling posts without end after it is triggered once. Does anybody know what could be causing this? This is what my code looks like where I am implementing ngInfiniteScroll, I don't know that this specific code will help much though. I suspect it is getting thrown off by code in another file.

<div style="height: 1px">
<post post-item="item" feed-items="items.feed" feed-name="feedName" ng-repeat="item in items.feed"> </post>
<div ng-if="items.feed.length == 0 && !initialLoad">
<div class="empty-message">Your feed is currently empty, visit the <a href="/#/users">Users</a> page     and find some more people to follow!</div>
</div>
<a infinite-scroll="nextPosts()" infinite-scroll-distance="1" href ng-click="nextPosts()"   class="show-more">Show more </a> 
</div>

解决方案

Example
You can use the infinite-scroll-disabled directive of ngInfiniteScroll to tell it to NOT load data if a call is already in progress.

E.g.

<div infinite-scroll='loadMore()' infinite-scroll-disabled='busyLoadingData' infinite-scroll-distance='1'>
  <p ng-repeat='item in items'>Some data</p>
</div>

JS:

$scope.busyLoadingData = false;

$scope.loadMore = function(){
  if ($scope.busyLoadingData) return;
  $scope.busyLoadingData = true;

  // $http call to get next set of data
  // on the .success() callback do $scope.busyLoadingData = false;
}

这篇关于如何从最初的触发后被多次触发prevent ngInfiniteScroll？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！