首页 文章

ionic2保持侧面菜单打开

提问于
浏览 次
4

我正在使用离子2，我在应用程序的左侧有一个离子菜单，当我打开菜单并触摸页面区域时，它会一直关闭 .

我想让它保持打开并仅在用户明确命令关闭它时关闭（通过关闭按钮，或者可能向后滑动，等等） . 这样做是否有任何选择或解决方法？

EDIT ：我从ionic2-starter-sidemenu开始 . 当我运行它时，它看起来像：

---------------------------------------------------------------
|           | <menuToggle button>                             |
|           |-------------------------------------------------|
|           |                                                 |
|           |                                                 |
|     /*    |                                                 |
| side menu |                                                 |
| toggled by|                                                 |
| menuToggle|           /* Content of each Pages */           |
|   button  |                                                 |
|     */    |                                                 |
|           |                                                 |
|           |                                                 |
|           |                                                 |
---------------------------------------------------------------

当我点击页面内容区域时，菜单关闭如下：

---------------------------------------------------------------
| <menuToggle button>                                         |
|-------------------------------------------------------------|
|                                                             |
|                                                             |
|                                                             |
|                                                             |
|                /* Content of each Pages */                  |
|                                                             |
|                                                             |
|                                                             |
|                                                             |
|                                                             |
---------------------------------------------------------------

我尝试阅读文档并搜索离子论坛，但没有找到任何解决方法 .

angular ionic2

4 回答

  • 0

    试试这个，它适合我：

    <ion-navbar >
  <button ion-button menuToggle>
    <ion-icon name="menu"></ion-icon>
  </button>
  <ion-title></ion-title>
  <ion-buttons start>
    <button ion-button (click)="func1()">
      <ion-icon name="add-circle"></ion-icon>
    </button>
    <button ion-button (click)="func2()">
      <ion-icon ios="ios-exit" md="md-exit"></ion-icon>
    </button>
  </ion-buttons>
</ion-navbar>
    回复于
  • 2

    这是一个快速黑客，直到他们发布更新：

    第一步：从当前的任何侧面菜单按钮中删除 menuClose

    然后在 app.component.ts 中调用MenuController：

    constructor(public menuCtrl: MenuController, public platform: Platform) {...

    ...
initializeApp() {
    this.platform.ready().then(() => {
        this.menuCtrl.open();
    });
}

    这有两个简单的行为，它们基本上暴露了 - 什么时候做了：

    • 在加载应用程序时打开菜单

    • 阻止任何导航按钮关闭菜单

    回复于
  • 0

    希望这个答案还不算太晚 . 然而，离子2现在支持splitplane，它完全按照您的描述工作 . 其语法如下：

    <ion-split-pane>
  <!--  our side menu  -->
  <ion-menu [content]="content">
    <ion-header>
      <ion-toolbar>
        <ion-title>Menu</ion-title>
      </ion-toolbar>
    </ion-header>
  </ion-menu>

  <!-- the main content -->
  <ion-nav [root]="root" main #content></ion-nav>
</ion-split-pane>

    enter image description here

    回复于
  • 2

    要停止关闭菜单，可以删除 app.html 中的 menuClose 属性/指令（here's a link to it in the reference project source）

    即这个 menuClose 位：

    <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">

    这里有关于MenuClose指令的更多信息，请注意您也可以通过编程方式关闭菜单 .

    此外，根据您使用的menu type，您可能会发现 reveal 的工作效果优于默认的 overlay 模式 .

    回复于

相关问题