I have created a basic app with tabs. I have two tabs in my app, NEW and DISPLAY.
When I'm in the NEW tab, I redirect to an item in the DISPLAY tab: #/tab/display/1
Then when I click DISPLAY tab, or if I click NEW tab and then DISPLAY tab again, that same item page is shown - and the DISPLAY tab is using the DisplayItemCtrl instead of DisplayCtrl. With other words, I cannot get back to the original DISPLAY page (#/tab/display).
Is there a way to clear the history or some other way to fix this?
If I first visit the DISPLAY tab page before I go to the NEW tab page to create an item, it works, as if the route is cached, but if I don't visit the DISPLAY page when I start the app and create a new item, it will not work.
These are my states:
.state('tab.new', {
url: '/new',
views: {
'tab-new': {
templateUrl: 'templates/tab-new.html',
controller: 'NewCtrl'
}
}
})
.state('tab.display', {
url: '/display',
views: {
'tab-display': {
templateUrl: 'templates/tab-display.html',
controller: 'DisplayCtrl'
}
}
})
.state('tab.display-item', {
url: '/display/:id',
views: {
'tab-display': {
templateUrl: 'templates/display-item.html',
controller: 'DisplayItemCtrl'
}
}
})
I created a simple tabs app on codepen just to show the problem. http://codepen.io/anon/pen/GInjq First go to Dash, and click "Redirect to a friend". After that it will be impossible to reach the Friends tab start page.
Did you try state redirection from your tab?
For ex:
<ion-tab title="Contact" icon="ion-ios7-world" ui-sref="tab.display">
<ion-nav-view name="contact-tab"></ion-nav-view>
</ion-tab>
see documentation
http://ionicframework.com/docs/api/directive/ionTab/
<ion-tab
title="Tab!"
icon="my-icon"
href="#/tab/tab-link"
on-select="onTabSelected()"
on-deselect="onTabDeselected()">
</ion-tab>
create a function, onTabSelected
that is called when the tab is clicked so that the ui-router doesnt manage it