In index.html
<ion-nav-view animation="nav-title-slide-ios7"></ion-nav-view>
In menu
<ion-side-menu-content>
<ion-nav-bar class="bar-royal">
<ion-nav-back-button class="button-icon ion-arrow-left-c"></ion-nav-back-button>
</ion-nav-bar>
<ion-nav-buttons side="left">
<!--<button class="button button-icon button-clear ion-navicon" ng-click="toggleLeft()"></button>-->
<img src="images/logo.png" class="header-logo" alt="TB logo"/><span class="beta">beta</span>
</ion-nav-buttons>
<ion-nav-buttons side="right">
<a ui-sref="main.status-new">
<i class="icon ion-compose light"></i>
</a>
</ion-nav-buttons>
<!-- HERE IS THE CONTENT INSERTED -->
<ion-nav-view name="mainContent"></ion-nav-view>
</ion-side-menu-content>
In some specific file
<ion-view title="Following">
<div ng-show="checkUser.connection">
<ion-content ng-controller="homeStatusesCtrl" ng-init="getHomeStatuses()" class="HOME has-tabs">
<ion-refresher pulling-text="Pull to refresh..." on-refresh="getHomeStatuses()"></ion-refresher>
<ion-list>
<ion-item ng-repeat="(key, status) in statuses | orderObjectBy:'time':true" class="item-thumbnail-left">
<img ng-src="{{ status.picture }}" alt="" />
<a ng-href="" class="username bold">{{ status.username }}</a>
<p ng-bind-html="status.status"></p>
</ion-item>
</ion-list>
<ion-infinite-scroll ng-if="lastStatusId != 0" on-infinite="loadMoreStatuses()" distance="10%"></ion-infinite-scroll>
</ion-content>
<div class="tabs tabs-icon-top royal-bg">
<a class="tab-item light">
<i class="icon ion-home"></i>
Home
</a>
<a class="tab-item light">
<i class="icon ion-star"></i>
Unfollowing
</a>
<a class="tab-item light">
<i class="icon ion-star"></i>
Suggested
</a>
<a class="tab-item light">
<i class="icon ion-alert"></i>
Notifications
</a>
</div>
</div>
Using together with ionic nav view, nav bar, and tabs.
When I load the page first time the infinite loader is fired BUT when i scroll down even when I have distance setted to 50% it’s just not working…
any idea what am I doing wrong? (testing in browser)