Two tab navigators in one page in Ionic 2 (beta-11)

Question

I am trying to find any examples for Ionic 2 where there are 2 Tab navigators in the same page but with no luck.

I currently have 1 Tabber as my root navigators and then I would like to have another tab menu under it (like a sub-menu) which would be visible only on a specific page.

So I added another tabs view in the <ion-content> of that page but that destroyed all my CSS - it moved the ion-content to absolute:0 and would not even show the newly added tabs menu.

It's just as shot in the dark but has anyone managed to achieve something similar to what I am trying?

(I know there are many examples for Ionic 1, but it's not compatible with 2)

Answer 1

It is better to avoid nested tabs. Because nested that layout will become a mess with the css and will be harder to maintain.

Try segments, this will simplify the layout

http://ionicframework.com/docs/v2/components/#segment382

Answer 2

If you really want to do that, you can use select(index|tab) method of Tabs. At first, get the ref of the Tabs. About how to get ref of Tabs, check this post