在 ionic 2 中使用带有侧边菜单的 nav.push

Posted 2023-03-13

【中文标题】在 ionic 2 中使用带有侧边菜单的 nav.push

【英文标题】：Use nav.push with side menu in ionic 2

【发布时间】：2016-10-20 17:02:33

【问题描述】：

我尝试在ionic2 中制作一个小应用程序来了解它，但我遇到了导航问题。

事实上，我非常了解rootpage（更改为nav.setRoot）和“正常”页面（添加nav.push）之间的区别。问题是对于我的应用程序，我需要能够打开一个侧边菜单（如果我在 rootpage 上，这没关系，但不是第二种类型的页面不行）并且能够返回（这对于推送页面是可以的，但对于根页面则不行）。

所以对我来说，这种类型的页面应该是推送而不是根页面，但是如何在这种类型的页面上显示侧边菜单？

谢谢。

【参考方案1】：

编辑：

在您的ion-menu 项目中使用persistent="true" 怎么样？就像您在 Ionic2 文档中看到的那样：

永久菜单永久菜单在 导航堆栈中所有页面上的导航栏。使菜单持久化 在元素上将 persistent 设置为 true。请注意，这将 仅影响附加到菜单的 NavBar 中的 MenuToggle 按钮 将 persistent 设置为 true，任何其他 MenuToggle 按钮都不会 受影响。

所以你的app.html 将是：

<ion-menu [content]="content" persistent="true">

  <ion-toolbar>
    <ion-title>Pages</ion-title>
  </ion-toolbar>

  <ion-content>
    <ion-list>
      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
        p.title
      </button>
      <button menuClose ion-item (click)="logout()">Logout</button>
    </ion-list>
  </ion-content>

</ion-menu>

<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

【讨论】：

完美运行。谢谢。

@sebaferreras 这会打开菜单，但它是推送页面下的一层

@ESturzenegger 推送页面下一层是什么意思？

@sebaferreras 假设我有一个菜单项 ENTRY1，我单击它。现在我单击该页面的链接，该链接将 ENTRY1_1 页面推送到导航堆栈。通过现在单击 ENTRY1_1 上的菜单按钮打开菜单，但我只有在弹出 ENTRY1_1 并返回 ENTRY1 时才能看到它。这就是我的意思是推送页面下的一层。

好的，已经修复了，哈哈...问题是我从模态框推送了第三页，然后将其关闭，而不是先关闭再推送