@thiagoaraujo84 wrote:
I have an ionic app based using ion-tabs and ion-infinite-scroll. The infinite scroll is working as well when is in the active tab.
The problem is when the user click to change the tab, the function "loadMore()" is called even ng-if is false.
<ion-view title="Tabs Controller"> <ion-tabs class="tabs-stable tabs-icon-top"> <ion-tab title="Tab1" icon="ion-model-s" href="#/app/tab1"> <ion-nav-view name="tab1"></ion-nav-view> </ion-tab> <ion-tab title="Tab2" icon="ion-map" href="#/app/tab2"> <ion-nav-view name="tab2"></ion-nav-view> </ion-tab> </ion-tabs> </ion-view> <ion-view title="Tab1"> <ion-content padding="false" class="has-header has-footer"> <ion-refresher on-refresh="doRefresh()" spinner="ripple"> </ion-refresher> <ion-list> <ion-item collection-item-width="'100%'" collection-item-height="100px" collection-repeat="item in items" class="item-thumbnail-left" ng-click="doSomething(item)"> <p>{{item}}</p> </ion-item> </ion-list> <ion-infinite-scroll spinner="ripple" immediate-check="false" ng-if="canUpdate()" on-infinite="loadMore()" distance="10%"></ion-infinite-scroll> </ion-content> </ion-view> $stateProvider .state('tabsController.tab1', { url: '/tab1', views: { 'tab1': { templateUrl: 'templates/tab1.html', controller: 'tab1Ctrl' } } }) .state('tabsController.tab2', { url: '/tab2', views: { 'tab2': { templateUrl: 'templates/tab2.html', controller: 'tab2Ctrl' } } }) .state('tabsController', { url: '/app', abstract:true, templateUrl: 'templates/tabsController.html', controller: 'AppCtrl' }); $scope.loadMore = function(){ $log.debug('loadMore called.'); MyService.getData() .then(function(items){ $scope.items = $scope.items.concat(items); }) .finally(function() { $timeout(function() { $timeout(function() { $ionicScrollDelegate.resize(); $scope.$broadcast('scroll.infiniteScrollComplete'); }); }); }); }
Can someone help me, please?
Posts: 1
Participants: 1