On-infinite not calling when use ion-affix


#1

In my Cordova-ionic mobile app, I am using ion-affix and ion-infinite-scroll for a list. Below the code;

    <div class="list" ng-repeat="thisitem in homeData.items_new">
        <div class="item item-divider item-energized text-center" ion-affix data-affix-within-parent-with-class="list">
            {{thisitem.Date}}
        </div>
        <div class="item item-text-wrap" ng-repeat="item_sub in thisitem.items">
            {{item_sub.Time}} - {{item_sub.FlightNo}}
        </div>
    </div>

 <ion-infinite-scroll ng-if="!homeData.noMoreItemsAvailable" on-infinite="home_load_flights()" distance="10%"></ion-infinite-scroll>

</ion-scroll>

The infinite scroll works fine at first loading. But when I refresh(pull down to refresh) the infinite scroll not working. Also when I remove the item for ion-affix, it works fine. Please help me.


#2

i’m having the same issue, hope someone can figure this out.


#3

Seems like a common problem.
Here is the link to the said plugin: https://github.com/aliok/ion-affix
Some help would be greatly appreciated! =)


#4

Found the solution: in the onDestroy event handler you have just to change the line

 angular.element($ionicScroll.element).off('scroll');

with

angular.element($ionicScroll.element).unbind('scroll', scrollHandler);

where scrollHandler is the function you pass in the bind function to scroll event

angular.element($ionicScroll.element).on('scroll', scrollHandler);