Question

我的向上滚动会触发我的infiniteSubjects()。但它应该只在向下滚动时触发它。我已经查看了很多帖子，但还没有找到解决方案。我曾尝试弄乱infinite-scroll-disabled。还尝试在底部的不同位置粘贴1003px高度<div>以占用空间。没有骰子。：/

<div ng-app="mainApp" ng-controller="gridController" class="container">
    <div class="row" infinite-scroll="infiniteSubjects()" infinite-scroll-distance="0" >
        <div ng-repeat="subject in (filteredSubjects = (allSubjects | orderBy:subjectOrder | limitTo:subjectLimit))">

            <div class="col-md-2 subject-card">
                {{ subject.name }}
             ..more divs in here..
            </div>
        </div>
    <div style="clear:both; height:1003px;"> </div>
    </div>
</div>

在我的控制器内：

$scope.infiniteSubjects = function() {
    console.log("scrolling");
    $scope.subjectLimit += 1;
};

我已经进入ng-infinite-scroll.js文件内部，通过添加一些console.logs来查看滚动的高度是什么

windowBottom = $window.height() + $window.scrollTop();
console.log("WINDOWBOTTOM " + windowBottom);

elementBottom = elem.offset().top + elem.height();
console.log("ELEMENT BOTTOM" + elementBottom);

remaining = elementBottom - windowBottom;
console.log("REMAINING" + remaining);

页面加载时：

WINDOWBOTTOM 1194
ELEMENT BOTTOM 1194
REMAINING 0

我不认为窗口底部和元素底部应该是相同的开始。他们为什么喜欢这个？

当我向下滚动时，我的remaining会增加-100 当我向上滚动时，remaining将增加100，但由于页面从0开始，它永远不会变为正数

Answer 1

在对SO进行了一些挖掘之后，我在类似的帖子中看到了另一个人的回答： ngInfiniteScroll - loadMore() method gets called on every mouse-scroll

我需要做的就是在我的HTML顶部指定<!DOCTYPE html>。

当我向上滚动时，AngularJS ngInfiniteScroll会继续触发

1 个答案: