3

我的向上滚动触发了我的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 开始

4

1 回答 1

2

在对 SO 进行了更多挖掘之后,我在类似的帖子中遇到了另一个人的答案: ngInfiniteScroll - loadMore() method gets called on each mouse-scroll

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

于 2015-07-30T09:31:07.530 回答