我正在开发一个Ionic 2应用程序,并在我的应用程序中有多个选项卡 .

  • My Plunker供参考 .

  • 在底部选项卡中有两个选项卡图标可用,一个是 home icon tab另一个是 menu icon tab

  • 截至目前,当单击底部选项卡 menu icon 时,顶部选项卡正在显示,如果再次单击按钮菜单图标,顶部选项卡将被隐藏,这是我们的功能 .

  • 我正在寻找 on clicking the menu icon 顶部标签需要显示,如果我们点击底部标签上的任何位置,顶部标签显示和隐藏,这里发生了什么...

We are looking for two tasks : -

  • 第一个是 on clicking the menu icon 顶部标签需要显示和隐藏 .

  • 第二个点击底部 home icon 需要重定向 home page .

  • 这两个图标需要执行两个不同的操作,但是如果单击 home icon 顶部选项卡正在显示 . 我不知道我在哪里做错了 . 我是离子2和角2的新手,所以请帮帮我....

  • 实际上我们在 ion-tabs 中使用了这个功能 (click)="x()" ,而且我在 ion-tab 中使用了这个功能___997393_知道我在哪里犯了错误...

On clicking tab menu Icon

<ion-tabs tabs-only (click)="x()" >
    <ion-tab tabIcon="home" [root]="tab1Root" ></ion-tab>
    <ion-tab tabIcon="menu"  ></ion-tab>

</ion-tabs>

My multiple tab Elements:

<ion-tabs tabs-only (click)="x()" >
    <ion-tab tabIcon="home" [root]="tab1Root" ></ion-tab>
    <ion-tab tabIcon="menu"  ></ion-tab>

</ion-tabs>

<ion-tabs tabs-only2 tabbar  [hidden]="hideTopTab" >
  <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
  <ion-tab [root]="tab2Root" tabTitle="Page" tabIcon="star"></ion-tab>

</ion-tabs>

Below function are used to [show] and [hidden] the another tab element:-

hideTopTab:boolean=true;
   x(){
     console.log(this.hideTopTab);

    this.hideTopTab = !this.hideTopTab;
}

请更新Plunker如果您有解决方案 .