Ionic 2のサブページのタブを非表示にする

Question

私のアプリケーションのすべてのサブページでタブを隠そうとしています。 私はこれを使用します：

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

私はionic serveを実行します。それは仕事です。 しかし、私のデバイス上でそれを実行しようとすると、私のタブは、サブページで非表示ではなく、私はそれを使用することはできません。

最終的に私のデバイスのタブを隠す人がいるのですか？

[更新] 私の子供のページに私はGoogleマップを持っています。私はそれを削除する場合、私はもう私の問題はありません。

子ページの.html：

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

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

子ページの.css：

#map { 
    height: 50%; 
} 

子ページ.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!'); 
    }); 
    } 
} 

私は本当にマップを持っている必要があります。誰かがすでにこの問題を抱えていますか？

Answer 1

ます。また、このようなapp.module.tsファイルにtabsHideOnSubPages設定プロパティを設定して試すことができます：あなたも同じようCSSクラスを使用することができ、タブを隠し、いつ表示すると完全に柔軟であるために

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

Answer 2

ion-tabs.hidden div.tabbar { 
    display: none 
} 

tabs.tsには、タブを非表示にするかどうかを示すブール変数を設定できます。 tabs.htmlで

public hideTabs:boolean = false; 

変数がtrueの場合hideTabsスタイルを適用するには、タブをイオンにngClassを追加します。

<ion-tabs [ngClass]="{'hidden': hideTabs}"> 

あなたは、任意の関数f.e.にhideTabs変数を切り替えることができますサブページにナビゲートする関数の中だけでなく、ionicのionViewWillEnter（）関数でも使用できます。

Answer 3

app.module.tsの "tabsHideOnSubPages：true"を追加すると、私の作品になります。 （イオン2）