Ionic nested state on back doesn't change state

Question

I have parent state order, and child states tables and articles. On click event in 'table' ionic view it redirect me to 'articles' view. When i press hardware back button in 'article' view, url changes, but state is the same (order.article). Here is my code

app.js

.state('order', {
    url: '/order',
    abstract: true,
    templateUrl: 'templates/order/index.html'
  })
  .state('order.tables', {
    url: '/tables',
    views: {
      'order-tables': {
        templateUrl: 'templates/order/tables.html',
        controller: 'OrderCtrl'
      }
    }
  })
  .state('order.article', {
    url: '/article',
    views: {
      'order-article': {
        templateUrl: 'templates/order/article.html',
        controller: 'ArticleCtrl'
      }
    }
  })

order/index.html

<ion-nav-view name="order-tables"></ion-nav-view>
<ion-nav-view name="order-article"></ion-nav-view>
<ion-nav-view name="order-unpaid"></ion-nav-view>
<ion-nav-view name="order-undone"></ion-nav-view>

order/tables.html

<ion-view>
  <ion-content>
    <div class="bar bar-header bar-light" style="position: relative;">
      <h1 class="title">Nova porudzbina</h1>
    </div>
    <ion-list>
      <a ng-click="chooseItem(table.stoID)">
        <ion-item collection-repeat="table in tables">
          {{table.brojStola}}
        </ion-item>
      </a>
    </ion-list>
  </ion-content>
</ion-view>

Also, when I put my ionic views into tabs, states changed on back button.

<ion-tabs>
    <ion-tab title="Tables" href="#/order/tables">
        <ion-nav-view name="order-tables"></ion-nav-view>
    </ion-tab>
    <ion-tab title="Articles" href="#/order/articles">
        <ion-nav-view name="order-articles"></ion-nav-view>
    </ion-tab>
</ion-tabs>

I don't need tabs, but I don't understand why in some case it works properly and in otner does not.

Rubin Khatami Rubin Khatami · Accepted Answer · 2016-09-14T04:22:37

In ui-view sense you are going to 'order.article' state from its parent: 'order' state and since your app 'order' state is 'abstract state', ui-view fails silently and stay in the same state. however in case of ion-tabs your ionic uses ui-view internally partially and it properly make and assign your tabs to 'order' parent (ignoring your abstract state). in that case when you transit to 'order.article' its parent states become orders and thats why you can change to tabs by back button

Ionic nested state on back doesn't change state

1 Answers