仅禁用滑动打开 ion-menu，不滑动关闭 Ionic 2

Question

我发现this question 的公认答案确实很有帮助，但发现它也禁用了滑动关闭手势。

有没有办法让它只在打开菜单时禁用，而不是关闭它？我在尝试关闭它时发现它有点反应迟钝，并认为滑动手势可以解决它。我在 Ionic 文档中找不到任何关于它的内容。

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

Answer 1

在 Ionic 中没有 默认 方法可以做到这一点，但您可以使用 ionOpen 和 ionClose 回调来处理何时应启用或禁用滑动功能：

1. 打开菜单后启用滑动功能，可以用来关闭菜单
2. 关闭菜单后禁用滑动功能，因此不能用于打开菜单

Working plunker。

---

查看

<ion-menu persistent="true" [content]="content" 
(ionOpen)="enableSwipe()"     <!-- Enable it when opening  -->
(ionClose)="disableSwipe()">  <!-- Disable it when closing -->
    <ion-header>
        <ion-toolbar color="primary">
            <ion-title>Side menu</ion-title>
        </ion-toolbar>
    </ion-header>    
    <ion-content>
    </ion-content>
</ion-menu>

<!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus -->
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

组件

import { Component, ViewEncapsulation } from '@angular/core';
import { MenuController } from 'ionic-angular';
import { HomePage } from '../pages/home/home';

@Component({
    templateUrl: 'app.html'
})
export class MyApp {
    public rootPage: any = HomePage;

    constructor(private menuCtrl: MenuController) {}

    ngAfterViewInit() {
      this.disableSwipe();
    }

    public enableSwipe(): void {
      this.menuCtrl.swipeEnable(true);
    }

    public disableSwipe(): void {
      this.menuCtrl.swipeEnable(false);
    }

  }