Hide tabs on sub-pages

Ionic Framework ionic-v3
1

Hi,

I have

 {
      mode: 'md',
      tabsHideOnSubPages: true
 }

On my settings, but on some sub-pages the tabs are showing. This seems a random behaviour.
Is this the right way of doing this?

Thanks
Artur

2

which ionic version are you on?

3

ionic 2.0.0-beta.37

Thanks

4

Thats the version of the CLI. Which version of the framework are you on? You can check that in your package.json

5

2.0.0-beta.11

This makes more sense… Sorry

6

Did you specify it in the global config like this?

platforms: {
  android: {
   tabsHideOnSubPages: true
  }
}

Inside the bootstrapping event as per these docs

7

Yes, exactly like that. But since I want it to be applied in every platform I have I just:

 {
      mode: 'md',
      tabsHideOnSubPages: true
 }

And it is working on some pages…

8

Ah thats weird. I experienced the same kind of behaviour once and it was due to some weird compiling issue. I removed the tabsHideOnSubPages line, saved everything. Then after compiling was completed, I readded the tabsHideOnSubPages as my first argument in the config and it was fixed. It felt like some rare kind of race condition to me. You could give it a try…

9

Thanks, but it didn’t work.

Still having the issue…

10

Yeah figured that wouldn’t work :-). And you don’t have any weird errors on the compiler or in the console?

11

No, no errors. Very strange indeed!

12

@arturalkaim When you say that it work in some pages, are those pages shown via NavController.push? and the ones that don’t work via NavController.setRoot?.

This happened in my case, because it seems that in child pages of tabs the setRoot define the page as root relative to the ion-tabs, not to the ion-nav, as I intended.

To solve that, I created a custom service named NavService that just have methods to set and get a NavController. Then, in my NavPage component (that has an ion-nav html tag) I set the NavController related to its ion-nav in the service. Finally, I inject the service in other pages and use the service NavController, instead of its own.

In NavPage:

@ViewChild('content') contentNavCtrl: NavController;

…

ngOnInit() {
    this.navService.setRootNav(this.contentNavCtrl);
    //...
}

In other pages (when I want to set a root page), and even in the NavPage too:

this.navService.getRootNav().setRoot(SomePage)

I also do push and pop this way, because it seems that pop in a page with tabs directly in the component NavController don’t work.

I don’t know if this is your case, but I solved my issue with tabs (both setRoot() and pop()) this way, using my custom service in all pages, instead of injecting the NavController in the constructor and using it.