javascript - AngularJS ngInfiniteScroll keeps firing as I scroll up -
my upwards scrolling triggers infinitesubjects()
. should trigger while scrolling downward. i've looked many posts haven't figured out solution. i've tried messing around infinite-scroll-disabled
. tried sticking 1003px height <div>
in different places @ bottom take space. no dice. :/
<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>
inside controller:
$scope.infinitesubjects = function() { console.log("scrolling"); $scope.subjectlimit += 1; };
i've gone inside ng-infinite-scroll.js
file see heights scrolling adding 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);
when page loads:
windowbottom 1194 element bottom 1194 remaining 0
i don't think window bottom , element bottom should same starting out. why this?
as scroll down, remaining
increment -100
scroll up, remaining
increment 100
, never becomes positive since page starts @ 0
after more digging around so, came across person's answer on similar post: nginfinitescroll - loadmore() method gets called on every mouse-scroll
all needed specify <!doctype html>
@ top of html.
Comments
Post a Comment