Ionic 2选项卡和侧边栏 - 如何使用setRoot维护选项卡?

时间:2016-11-11 14:39:50

标签: tabs navigation ionic2

我有一个使用侧边栏和标签的Ionic 2应用程序。

我已设法在侧边栏中创建一个链接,将用户发送回根页面,但这会杀死标签。我希望标签能够持久化。

这就是我所拥有的:

app.html

`<ion-menu [content]="content">
   <ion-toolbar>
     <ion-title>Menu</ion-title>
   </ion-toolbar>

  <ion-content>
   <ion-list>
     <ion-item (click)="openPage(page)" *ngFor="let page of pages">
      <span>{{page.title}}</span>
    </ion-item>
  </ion-list>
</ion-content>

<ion-nav id="nav" [root]="rootPage" #content swipe-back-enabled="false"></ion-nav>

然后在我的app.ts中我有这个功能:

openPage(page) {
  this.menu.close();
  this.nav.setRoot(page.component);
}

所以这确实有效,但我失去了标签。有更好的方法吗?

2 个答案:

答案 0 :(得分:0)

this.nav.setRoot(TabsPage);

TabsPage是标签页组件的类名。

答案 1 :(得分:-1)

您可以参考ionic-conference-app。它对我有用。

  openPage(page){
    this.menu.close();
    let params = {};
    if (page.index) {
      params = { tabIndex: page.index };
    }
    if (this.nav.getActiveChildNavs().length && page.index != undefined) {
      this.nav.getActiveChildNavs()[0].select(page.index);
    } else {
      this.nav.setRoot(page.name, params).catch((err: any) => {
        console.log(`Didn't set nav root: ${err}`);
      });
    }
  }