ngInfiniteScroll不工作

Question

我想重新創建他們的演示頁面上提供的一個簡單的ngInfiniteScroll示例。 loadMore（）函數從不觸發，我不知道爲什麼。代碼：http://jsfiddle.net/uVxb8/3/。

<div ng-app='myApp' ng-controller='DemoController'> 
    <div infinite-scroll='loadMore()' infinite-scroll-distance='2'> 
    <img ng-repeat='image in images' ng-src='http://placehold.it/225x250&text={{image}}'> 
    </div> 
</div> 

var myApp = angular.module('myApp', ['infinite-scroll']); 

myApp.controller('DemoController', function($scope) { 
    $scope.images = [1, 2, 3, 4, 5, 6, 7, 8]; 

    $scope.loadMore = function() { 
    var last = $scope.images[$scope.images.length - 1]; 
    for(var i = 1; i <= 8; i++) { 
     $scope.images.push(last + i); 
    } 
    }; 
}); 

Answer 1

您的方法看起來非常複雜。這裏是我在這個指令中寫的（並且從另一個問題出發，我相信），我相信完全相同的行爲（當向下滾動時，它會觸發一個載入更多相同內容的函數）：

RandomName.directive('isScrolled', ['$window', '$document', function($window, $document) { 
    return { 

     link: function($scope, elem, attr) { 
       var $myWindow = angular.element($window); 
       var $myDoc = angular.element($document); 

       $myWindow.bind('scroll', function() { 
        if ($myWindow.height() + $myWindow.scrollTop() >= $myDoc.height()) { 
         $scope.$apply(attr.isScrolled); 
        } 
       }); 
      } 
    } 
}]); 

我「聽」滾動事件，然後每次發生時我檢查它是否在頁面的末尾，如果是我通過屬性觸發我的功能。在這個特定的情況下，只有當你滾動到最後時，纔會觸發它，你可能會做更平滑的事情。