从 ionic 2 中的侧面导航菜单切换应用程序页面时，后退按钮不可用答案

【问题标题】：Back button is not available when teversing application page from side navigation menu in ionic 2从 ionic 2 中的侧面导航菜单切换应用程序页面时，后退按钮不可用
【发布时间】：2018-01-24 04:58:09
【问题描述】：

我正在开发一个 ionic 2 移动应用程序，我发现当我通过侧导航面板访问页面时，它没有在特定页面上提供自动生成的后退按钮，而当我以正常遍历形式访问页面时一页一页，然后该页面可通过后退按钮使用。如何从侧面导航面板菜单中获得后退按钮，请建议。

<ion-header>

  <ion-navbar color="primary">
  <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>dashboard</ion-title>
  </ion-navbar>

【问题讨论】：

请显示代码。
您的 ts 代码如何使用“侧导航面板”进行导航？

标签： ionic-framework navigation-drawer back-button android-side-navigation

【解决方案1】：

如果您在创建项目时创建了 sidemenu 应用程序，您可以在 app.component.ts

中看到以下代码

constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) {
    this.initializeApp();

    // used for an example of ngFor and navigation
    this.pages = [
      { title: 'Home', component: Createpage}
    ];

  }

  initializeApp() {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });
  }

  openPage(page) {
    // Reset the content nav to have just this page
    this.nav.setRoot(page.component);
  }

正如您在 openPage 函数中看到的，它将页面组件设置为 root，因此您看不到返回按钮，而是看到打开侧边菜单的汉堡图标

现在

如果您仍然希望使用后退按钮从侧面菜单打开页面，您可以这样做

openPage(page) {
    // Reset the content nav to have just this page
    // we wouldn't want the back button to show in this scenario
    if(page.component == HomePage){
      this.nav.setRoot(HomePage);
    } else {
      this.nav.push(page.component);
    }
  }

在上面的代码中，您检查它是否是后退按钮组件（您希望使用后退按钮打开它），如果是真的，您可以将其设置为 push 而不是 setRoot

评论以获得更多说明

【讨论】：