Clearify Ionic state logic

ionic-v1
1

Dear developers.

I started using ionic as a ‘prototype’ concept, and so far it has been good…
But there has been some doubt about the ‘usability’ of the out-of-the-box stateProvider…

Lest say i have the following routes:

$stateProvider

  // setup an abstract state for the tabs directive
  .state('tab', {
    url: '/tab',
    abstract: true,
    templateUrl: 'templates/tabs.html'
  })

  // Each tab has its own nav history stack:
  .state('tab.chats', {
    url: '/chats',
    views: {
      'tab-chats': {
        templateUrl: 'templates/tab-chats.html',
        controller: 'ChatsCtrl'
      }
    }
  })
  .state('tab.chat-detail', {
    url: '/chats/:chatId',
    views: {
      'tab-chats': {
        templateUrl: 'templates/chat-detail.html',
        controller: 'ChatDetailCtrl'
      }
    }
  })

.state('tab.users', {
    url: '/users',
    views: {
      'tab-users': {
        templateUrl: 'templates/tab-users.html',
        controller: 'UsersCtrl'
      }
    }
  })

  .state('tab.user-detail', {
    url: '/users/:userId',
    views: {
      'tab-users': {
        templateUrl: 'templates/tab-profile.html',
        controller: 'UserDetailCtrl'
      }
    }
  })

As you can see, it has a ‘tab’ layout…

BUT

What if I want a second page, that is not inside on of the tabs… So lets say i add another ‘page’.

.state('settings', {
    url: '/settings',
    templateUrl: 'templates/settings.html',
    controller: 'settingsCtrl'
  })

Because its not inside the tabs… There is no routing back?

I use this ionic native element:

<ion-nav-bar class="bar-stable" no-tap-scroll="true" align-title="left" >
  <ion-nav-back-button class="button-clear">
    <i class="ion-chevron-left"></i>
  </ion-nav-back-button>
</ion-nav-bar>

But it only shows a ‘back’ button when you jump between tabs? And even then is seems broken… Because if you jump from inside a ‘sub’ tab, into another ‘sub’ tab, there is also no back button.

A.K: tab.user-detail -> tab.chat-detail…

This is inside the same ‘parent’ tabs, but ionic does not show a back button when jumping between those 2 sub-tabs… As a user(profile) could jump to the corresponding chat and vica versa… Does not work.

Is the ionic stateProvider so damn simple [faulty]? Or are you supposed to build your own history stack? Because it looks like ionic does not care about your ‘history’, its only made to have an app with some simple tabs…

Thanks!

2

@DutchKev, were you able to find a solution. Im very interested, thank you!