Angular 在Ionic 2中隐藏子页中的选项卡

我尝试在我的应用程序中隐藏所有子页面的选项卡。 我用这个：

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

子页面。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!');
    });
  }
}

---

我真的需要一张地图。有人已经有这个问题了？

您也可以在

app.module.ts

文件中设置

tabsHideOnSubPages

config属性，如下所示：

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

---

从：

tabsHideOnSubPages

：

boolean

是否隐藏子页面上的选项卡。如果是真的，那就不会了 显示子页面上的选项卡

---

要完全灵活地隐藏和显示选项卡，还可以使用如下CSS类：

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

在您的tabs.ts中，您可以使用一个布尔变量来表示是否应该隐藏选项卡

public hideTabs:boolean = false;

在tabs.html中，将ngClass添加到ion选项卡，以在变量为true时应用hideTabs样式：

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

---

您可以在导航到子页面的函数中的任何函数f.e.中切换hideTabs变量，也可以在ionic的ionViewWillEnter（）函数中切换hideTabs变量。

要在app.module.ts中添加“tabsHideOnSubPages:true”，我可以这样做。（爱奥尼亚2）

你的爱奥尼亚版本是什么？在您的package.json中，您希望看到什么？我有“@ionic/app脚本”：“1.1.4”？好的。我想知道您是否使用了较旧版本的

ionic angular

。我使用的是相同的代码，它可以工作。我使用的是“ionic angular”：“2.2.0”你测试了哪个设备？它不能工作。我已经更新了我的帖子，它不起作用了bro@sebaferras，对不起，我不打算否决投票。我不小心做了那件事。当我试图撤销我的行为时，我不能。很抱歉我犯了错误。你能对答案做些修改吗？这样我就可以取消否决票了？还有，你能不能把我的问题通读一遍？@sebafereras谢谢你的回答，很好。非常感谢。

public hideTabs:boolean = false;

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