I have the following parent states:
// setup an abstract state for the tabs directive
.state('tab', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html",
controller: "TabCtrl"
})
// Each tab has its own nav history stack:
.state('tab.home', {
url: '/home',
views: {
'menuContent': {
templateUrl: 'templates/tab-home.html',
controller: 'HomeCtrl',
resolve: {authResolve: authResolve}
}
}
})
//
.state('tab.dash', {
url: '/dash',
views: {
'menuContent': {
templateUrl: 'templates/tab-dash.html',
controller: 'DashCtrl',
resolve: {authResolve: authResolve}
}
}
})
and the following child state of tab.dash
.state('tab.album', {
url: '/dash/:albumName',
views: {
'menuContent': {
templateUrl: 'templates/tab-album.html',
controller: 'AlbumCtrl',
resolve: {authResolve: authResolve}
}
}
})
In addition I have one independent state
// none tabs/nonview pages
.state('neutral', {
url: '/neutral',
templateUrl: 'templates/single-neutral.html',
controller: 'NeutralCtrl',
resolve: {authResolve: authResolve}
})
THE PROBLEM
In the independent state neutral
, when I try to redirect to the child state tab.album
then it only works if first I reached the neutral
state from tab.album
. When I reach neutral
from tab.home
and then try to redirect to tab.album
, then I get redirected to tab.dash
, the parent of tab.album
. So to make it more clear:
This works:
tab.home > tab.dash > tab.album > neutral > tab.album
This does not work:
tab.home > neutral > tab.album
What is the reason for this and how can I solve it?
here is a blog post that shows how to force the tab to go to the top level whenever it is activated. http://www.clearlyinnovative.com/ionic-framework-tabs-go-home-view/
You should be able to use the same approach to tell the tab to goto a particular child state based on a stateParameter
you pass to it.