ionic2 с открытым боковым меню

Я работаю с ionic 2, и у меня есть ионное меню в левой части приложения, которое закрывается, когда я открываю меню и касаюсь области страницы.

Я бы хотел, чтобы он оставался открытым и закрывался только тогда, когда пользователь явно приказал закрыть его (с помощью кнопки закрытия или, возможно, проведя назад, что угодно). Есть ли какой-либо вариант или обходной путь для этого?

РЕДАКТИРОВАТЬ: я начал с ionic2-Starter-SideMenu. когда я запускаю его, это выглядит так:

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

и когда я щелкаю область содержимого страницы, меню закрывается следующим образом:

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

Я пытался читать документацию и искал ионный форум, но ничего не нашел, чтобы решить это.

4 ответа

Вот быстрый взлом, пока они не выпустят обновление:

Первый: удалить menuClose от любой из ваших текущих кнопок бокового меню

Затем в app.component.ts вызовите MenuController:

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

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

Это делает 2 простых поведения, которые выставляют в стороне, когда делали в основном:

  • открывает меню при загрузке приложения
  • предотвращает закрытие меню любыми навигационными кнопками

Надеюсь, этот ответ не слишком поздно. Однако ionic 2 теперь поддерживает расщепленную плоскость, которая работает именно так, как вы описали. Его синтаксис такой:

<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>

Попробуйте это, у меня это хорошо работает:

<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>

Чтобы остановить закрытие меню, вы можете удалить menuClose атрибут / директива в app.html ( вот ссылка на него в справочном источнике проекта)

то есть это menuClose немного:

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

Вот еще немного информации о директиве MenuClose, и обратите внимание, что вы также можете закрыть меню программным способом.

Кроме того, в зависимости от типа меню, которое вы используете, вы можете найти reveal работает лучше, чем по умолчанию overlay Режим.

Другие вопросы по тегам