On-infinite called twice when using ion-infinite-scroll


#1

Any idea why my ng-infinite called twice when scroll to the bottom? I am using masonry to display my items, could this be the problem?

     <div id="masonry" style="margin:0 auto;padding:0;" preserve-order>
       <div class="masonry-brick half pin" ng-repeat="deal in deals" >
   </div>
     <ion-infinite-scroll ng-if="!noMoreItemsAvailable" on-infinite="infiniteLoad()" distance="10%"></ion-infinite-scroll>
    </div>

#2

Still the same when I test in a fresh project.

  <div class="list">
     <div class="deal" ng-repeat="deal in deals">
   	<img id="uplaoded-image" style="width:50%;" ng-src="{{deal.image.original.mobile_large.url}}" />
			
    </div>
</div>
<ion-infinite-scroll ng-if="!noMoreItemsAvailable" on-infinite="loadDeal()" distance="5%"></ion-infinite-scroll>

#3

Confirmed. Thanks for catching this. I’ll point it out to the devs now.


#4

after infiniteScrollCtrl.isLoading set to true line 40200, the infiniteScrollCtrl.isLoading(line 40226 checkInfiniteBounds()) still returns false, so onInfinite() runs again. Any idea? Setting a break point at line 40200 then resume will make it work properly.


#5

See andy’s post about why things are being called twice.