ngInfiniteScroll fires Multiple calls about nginfinitescroll HOT 4 CLOSED

Hey, @gnesher,

The directive was designed to make as few assumptions about what you're doing inside the callback function as possible. As such, if you're doing asynchronous work and you want to temporarily disable the callback (e.g. you don't want the directive to fire the callback, even if the user is scrolling), you can assign a dynamic value to infinite-scroll-disabled. The async demo on the web site shows such an example; here are the relevant snippets:

HTML:

<div infinite-scroll='nextPage()' infinite-scroll-disabled='busy'>
  ...
</div>

JavaScript:

app.controller('DemoController', function($scope, $http) {
  $scope.busy = false;

  $scope.nextPage = function() {
    // this is a safeguard; the callback shouldn't actually be called
    if ($scope.busy) return;
    $scope.busy = true;

    $http.jsonp(url).success(function(data) {
      ...
      $scope.busy = false;
    });
  };
});

Of course, you can (and should) wrap up all the logic for your data into a service; the demo does it all in a controller for simplicity.

Let me know if you still have questions or have any problems with this.

from nginfinitescroll.

I'd recommend using 'async/cargo' instead:

import cargo from 'async/cargo';

export default function DemoController($scope, $http) {
  const cargo = async.cargo(function(tasks, callback) {
      $http.jsonp(url).success(function(data) {
        $scope.data = data;
        callback();
      });
  });

  $scope.nextPage = function() {
    cargo.push({});
  };
});

DemoController.inject = ['$scope', '$http'];

consider each orange block ng-infinite-scroll calling your function.

from nginfinitescroll.

I tried the same, but still it fires couple of times, what is the problem

from nginfinitescroll.

I tried the same, and it fixed my problem of firing a couple of times.

Here's the updated demo link: http://sroze.github.io/ngInfiniteScroll/demo_async.html

from nginfinitescroll.