HideTabsOnSubPages seems to dont work in certain situation

Ionic Framework ionic-v3
1

Hello Ionic community,
I’m coming here with problem that seems to have no-known solution at least for me.

Im already on:

Ionic version: 3.20.0

The problem:
Okey, so Im using tabs as the main navigation element in my app. I’ve managed to set it up so it doesnt show tabs on subpages, using the directive on each HTML tag like this:

<ion-tab [root]="tab1Root" tabTitle="Person" tabIcon="person" tabsHideOnSubPages="true"></ion-tab>

It worked like a charm in all situations except one. I found out that if Im deep in navigation stack on subpages let’s say:
Person -> Page1 -> Page2 -> Page3
and now I would like to go back to the one of the tabs page using

this.navCtrl.setRoot(TabsPage,{index:1});

which takes me directly to the second tab page. So far so good.

But now, if I decide to push another page on the stack, it doesnt hide the Tabs on the next subpage. If I pop back and push the same page again… Tabs are hidden again correctly…

I believe there’s problem with setting TabsPage as a root, because if I just push another page from TabsPage it normally hides the Tabs.

Would appreciate any tips or solutions.

Thanks in advance.

2

That is the version of Ionic CLI which is pretty irrelevant. What is your ionic info output?

3

Oh, right you are… didnt know that, I was used to -v types of command like:

ionic -v

Output of ionic info:

cli packages: (AppData\Roaming\npm\node_modules)

    @ionic/cli-utils  : 1.19.2
    ionic (Ionic CLI) : 3.20.0

global packages:

    cordova (Cordova CLI) : 8.0.0

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : android 7.0.0
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node : v6.11.3
    npm  : 5.4.2
4

Did you ever find a solution?

5

I dont think so… I managed to work it around as I knew the problem is caused by setting root to one of the tabs page, so I simply didnt do that (basically I rebuilt structure of the pages, so I could simply pop the page from the stack several times instead of setting root to the tabs page… ).
As stated above, tabsHideOnSubPages directive works well in almost all situations, I do not know what problem are you trying to solve, but I didnt solve the one described here.

6

I did some further research and found out that you can find the root nav of the whole application use app.getrootnav(). If you navigate to the root page in this way the configuration setting will still work.

7

Yeah, assuming your root page is the Tabs page, which in my scenario was not. I was trying to get back to the Tabs page, not to my real root page. But after few months I have to say, that my app structure was very poorly done.

TL:DR app.getrootnav() would work just fine in standard case, where’s your Tabs page also root page of the app.