Question

我使用sidemenu ionic 2.当我从左向右滑动此页面时，侧面菜单滑出我需要在特定页面中禁用侧面菜单。

app.html

    <ion-menu [content]="content">
     <ion-content>
      <ion-list>
       <button ion-item *ngFor="let p of pages" menuClose (click)="openPage(p)" >
        <ion-icon name="{{p.icon}}" item-left></ion-icon>
        {{p.title}}
      </button>
     </ion-list>
  </ion-content>
</ion-menu>

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

page.html我在此页面中禁用了swipemenu，仅在我滑动时禁用

import {Component} from '@angular/core';
import {NavController} from 'ionic-angular';
@Component({
  templateUrl: 'build/pages/portrait/portrait.html'
})
export class Portrait {
}

page.html中

<ion-navbar persianred *navbar>
  <button menuToggle>
    <ion-icon name="menu"></ion-icon>
  </button>
  <ion-title>
   Portrait
  </ion-title>
</ion-navbar>

Answer 1

根据您要禁用菜单的位置，有几种方法可以执行此操作：

仅在一页上禁用它
在某些页面上禁用它（不重复重复相同的代码）
在所有页面中禁用它

1）仅在一页上禁用它

如果要禁止滑动以便在一个页面中查看，最简单的方法是注入MenuController实例并使用swipeEnable(shouldEnable, menuId)方法（ Ionic docs < /强>）。

import { NavController, MenuController } from 'ionic-angular/index'; import { Component } from "@angular/core"; @Component({ templateUrl:"home.html" }) export class HomePage { constructor(private menu: MenuController, ...) { } ionViewDidEnter() { this.menu.swipeEnable(false); // If you have more than one side menu, use the id like below // this.menu.swipeEnable(false, 'menu1'); } ionViewWillLeave() { // Don't forget to return the swipe to normal, otherwise // the rest of the pages won't be able to swipe to open menu this.menu.swipeEnable(true); // If you have more than one side menu, use the id like below // this.menu.swipeEnable(true, 'menu1'); } }

请注意两件事：

1）如果您使用了ID，那么您需要将id添加到您的菜单中：

<ion-menu [content]="content" side="left" id="menu1">

2）您需要已加载视图才能禁用菜单，因此一种方法是使用ionViewDidEnter事件。

2）在某些页面上禁用它

如果要在某些页面上禁用侧边菜单（例如登录/注册页面），但您不想在每个页面上注入MenuController，然后处理ionViewDidEnter / ionViewWillLeave，您可以使用自定义装饰器。有关详细信息，请查看 this SO answer 。

3）在所有页面中禁用它

如果您要禁用滑动以在应用中的任何位置查看，最简单的方法是使用swipeEnabled输入属性（ Ionic docs ）：

<ion-menu [content]="content" [swipeEnabled]="false">...</ion-menu>

Answer 2

您可以使用enable的{{1}}方法启用/禁用特定页面的菜单。

打开页面时使用菜单ID调用启用，当您离开页面时禁用。如果您的应用中有一个菜单实例，则可以省略菜单ID。

Source

Answer 3

最好又简单

app.component.ts file

中的

变化

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

到<ion-menu [content]="content" hidden>

多数民众赞成，它将隐藏侧面菜单

Answer 4

在我的案例中，有效的方法是将[swipeEnabled]="false"添加到离子菜单中。这样我只有在点击菜单图标时才能显示侧边菜单。这基于Ionic 2文档：Menu。

Answer 5

基于“swipeEnabled”选项，我所做的是使用布尔变量设置条件。

<ion-menu [content]="content" [swipeEnabled]="(userLogged) ? true : false">

对我来说很有用。

只是一个建议：也许有人会注意到，如果变量不是全局变量，即使跳转到另一个页面，应用程序也将保持不滑动。但是，除了将变量设置为全局将解决之外，在用户关闭并重新打开应用程序后，滑动将正常工作。

Answer 6

简单而最佳的答案就在这里...

在您的homepage.ts中，

  constructor(private menu: MenuController) { }

  ionViewDidEnter(){
    this.menu.swipeEnable(true);
  }

  ionViewWillLeave(){
    this.menu.swipeEnable(false);
  }

将禁用除主页以外的所有其他页面上的滑动。

禁用滑动以查看sidemenu ionic 2

6 个答案:

1）仅在一页上禁用它

2）在某些页面上禁用它

3）在所有页面中禁用它