Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hide tabs in sub pages in Ionic 2 [duplicate]

I try to hide tabs on all my subpages in my app. I use this :

<ion-tab [root]="MyPage" tabsHideOnSubPages="true" ...></ion-tab>

When I run ionic serve; it's work. But when I try to run it on my devices, my tabs aren't hide in the sub pages, and I can't use it.

Someone has an idea to finally hide my tabs in my devices ?

[update] In my child page I have a google map. If I delete it I don't have my problem anymore.

Child page .html :

<ion-header>
  <c-header></c-header>
</ion-header>

<ion-content>
  <div id="map"></div>
</ion-content>

Child page .css :

#map {
  height: 50%;
}

Child page .ts :

import { Component } from '@angular/core';
import { NavController, Platform } from 'ionic-angular';
import { GoogleMap, GoogleMapsEvent, GoogleMapsLatLng } from 'ionic-native';

/*
  Generated class for the DetailsMedicalEvent page.

  See http://ionicframework.com/docs/v2/components/#navigation for more info on
  Ionic pages and navigation.
*/
@Component({
  selector: 'page-details-medical-event',
  templateUrl: 'details-medical-event.html'
})
export class DetailsMedicalEventPage {

  map: GoogleMap;

  constructor(public navCtrl: NavController, public platform: Platform) {
    platform.ready().then(() => {
      this.loadMap();
    });
  }

  loadMap(){

    let location = new GoogleMapsLatLng(-34.9290,138.6010);

    this.map = new GoogleMap('map', {
      'backgroundColor': 'white',
      'controls': {
        'compass': true,
        'myLocationButton': true,
        'indoorPicker': true,
        'zoom': true
      },
      'gestures': {
        'scroll': true,
        'tilt': true,
        'rotate': true,
        'zoom': true
      },
      'camera': {
        'latLng': location,
        'tilt': 30,
        'zoom': 15,
        'bearing': 50
      }
    });

    this.map.on(GoogleMapsEvent.MAP_READY).subscribe(() => {
      console.log('Map is ready!');
    });
  }
}

I really need to have a map. Someone already have this problem ?

like image 628
V. Pivet Avatar asked Nov 27 '22 08:11

V. Pivet


2 Answers

You can also try by setting the tabsHideOnSubPages config property in the app.module.ts file like this:

... 
imports: [
    IonicModule.forRoot(MyApp, {
        // Tabs config
        tabsHideOnSubPages: true,
        ...
    })
]
...

From Ionic docs:

tabsHideOnSubPages: boolean

Whether to hide the tabs on child pages or not. If true it will not show the tabs on child pages.

like image 169
sebaferreras Avatar answered Dec 09 '22 20:12

sebaferreras


To add "tabsHideOnSubPages: true" in app.module.ts works for me. (ionic 2)

like image 23
llb Avatar answered Dec 09 '22 20:12

llb