My current setup includes the following parent states:
// Abstract state for tabs directive
.state('tab', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html",
controller: "TabCtrl"
})
// Each tab has its own navigation 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 I also have 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}
}
}
})
Additionally, there is one independent state as well
// Pages outside tabs/views
.state('neutral', {
url: '/neutral',
templateUrl: 'templates/single-neutral.html',
controller: 'NeutralCtrl',
resolve: {authResolve: authResolve}
})
THE ISSUE
In the independent state neutral, when attempting to redirect to the child state tab.album, it only works if initially reaching the neutral state from tab.album. However, if arriving at neutral from tab.home and then trying to redirect to tab.album, the redirection leads to tab.dash, the parent of tab.album. To clarify:
This scenario works:
tab.home > tab.dash > tab.album > neutral > tab.album
While this does not work:
tab.home > neutral > tab.album
What could be causing this issue and how can it be resolved?