Animation problem in nested tab view navigation

ionic-v1
1

Hi Guys, I am new to ionic, need your help on following problem:

I have two tabs and each tab have two templates.(say one is index page, the other is detail page). When I navigate from the index page to its detail page, the animation works fine.
But how could I have the same animation when I was navigate from tab2-detail to tab1-detail?

I have a pen here: http://codepen.io/vilight/pen/KCfoG

As you can see when you click the button(“go to chat detail from contact”) in Contacts-detail, the animation doesn’t work.

Plus, two more problem also comes following (when click the button):

  • The ‘chat detail’ page doesn’t have the “Back” button.
  • When you click again on the ‘contact’ tab, it shows the ‘contact detail’ page still, NOT the ‘contact index’ page.

Can anyone kindly help on above three problems? Many thanks. (I have tried every way I can found but still not resolve it, hope I could get some help here.)

2

anyone able to help or give some hint ???

3

Hey there! Sorry I must have missed this one.

For the animation, you can apply one of our animation classes on the ion-tabs

As for the other two situations. This is to be expected. Since each tab has it’s own navigation stack, they both will retain the history and current view even when you navigate away from them. This image really helps visualize the separation of history.

4

@mhartington Thanks for your response!

Apply animation on the ion-tabs will have all the tabs behave the animation, but what I am looking for is when click on the tab, it should not have the animation. The animation should only applied when navigate between different ‘pages’. Any work-around?

And for the tab’s navigation stack, is there a way to reset the stack before navigate away from them?

Thanks again!