Multiple tab bar application

Hi all!

I’m working on a tablet application where the tab bar needs to change when I visit a certain page. The app is not using side menu, only a tab bar. On the first page, I have a simple ion-list where each item has a ng-click event that fires a $state.go to the new page.

On this second page, I need to see another tab bar than the one before. But when I go to the second page, the tab bar changes but my page is empty. On each tab, there is another ion-nav-view so I think my page is loaded in the wrong ion-nav-view or something?

Does anyone have some advice or an example on how to make an app with multiple tab bars?


I’m unable to understand what exactly the problem you’re facing
instead of using multiple tab bars, you can change icons on one tab bar
hope it helps

This is the situation I want:

Tab bar 1

  • Tab 1: Page 1 -> Here I can click to Page 3
  • Tab 2: Page 2

Tab bar 2

  • Tab 1: Page 3
  • Tab 2: Page 4

Is it possible to not only change the text/icons, but also the link behind that tab button then?

In this codepen you can click on the button “Scientific facts” to go to the next one, and when I press the tab button “Home” again I will go back to page 1. This is a situation that I don’t want when I’m on page 3. Can I disable that?