Ionic-framework: MenuControl swipeEnable problem

Created on 18 Oct 2018 · 9Comments · Source: ionic-team/ionic-framework

Bug Report

Ionic Info
Run ionic info from a terminal/cmd prompt and paste the output below.

Ionic:

   ionic (Ionic CLI)             : 4.2.1 (/Users/camilo/.nvm/versions/node/v8.11.1/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-beta.13
   @angular-devkit/build-angular : 0.8.5
   @angular-devkit/schematics    : 0.8.5
   @angular/cli                  : 6.2.5
   @ionic/angular-toolkit        : 1.0.0

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : none
   Cordova Plugins       : no whitelisted plugins (0 plugins total)

System:

   Android SDK Tools : 26.1.1 (/Users/camilo/Library/Android/sdk/)
   ios-deploy        : 2.0.0
   ios-sim           : 7.0.0
   NodeJS            : v8.11.1 (/Users/camilo/.nvm/versions/node/v8.11.1/bin/node)
   npm               : 6.4.1
   OS                : macOS High Sierra
   Xcode             : Xcode 10.0 Build version 10A255

Describe the Bug
In a page, i want to disable the menu swipe action, calling this.menuController.swipeEnable(false); buy i get the following error:

core.js:1673 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'apply' of undefined
TypeError: Cannot read property 'apply' of undefined
    at util.js:20
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:3820)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:872
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3811)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at util.js:20
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:3820)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:872
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3811)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at resolvePromise (zone.js:814)
    at zone.js:877
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3811)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)

Steps to Reproduce
Steps to reproduce the behavior:

Go to '...'
Click on '....'
Scroll down to '....'
See error

Related Code
this is my page code.

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Validators, FormBuilder } from '@angular/forms';
import { UsuarioApi } from '../../../shared/sdk';
import { Router } from '@angular/router';
import { MenuController } from '@ionic/angular';

@Component({
  selector: 'app-login',
  templateUrl: './login.page.html',
  styleUrls: ['./login.page.scss'],
})
export class LoginPage implements OnInit, OnDestroy {

  loginForm = this.formBuilder.group({
    email: ['', [Validators.email, Validators.required]],
    password: ['', Validators.required]
  });

  constructor(private formBuilder: FormBuilder,
    private usuarioApi: UsuarioApi,
    private router: Router,
    private menuController: MenuController
    ) { }

  ngOnInit() {
    this.menuController.swipeEnable(false);
  }

  ngOnDestroy(): void {
    this.menuController.swipeEnable(true);
  }

  onSubmit() {
    console.log('hola mundo');
    const email = this.loginForm.get('email').value;
    const password = this.loginForm.get('password').value;
    this.usuarioApi.login({ email: email, password: password }).subscribe(usuarioData => {
      console.log(usuarioData);
      this.router.navigate(['miembros']);
    }, error => {
      console.error(error);
    });
  }

}

Expected Behavior
disable the menu swipe action in the page.

investigation

Source

csotomon

👍6

Most helpful comment

yea was getting the same error. I ended up by directly setting swipeGesture property to false

this.menuController.get().then((menu: HTMLIonMenuElement) => {
  menu.swipeGesture = false;
});

tomskoda on 19 Oct 2018

🎉8 👍2

All 9 comments

yea was getting the same error. I ended up by directly setting swipeGesture property to false

this.menuController.get().then((menu: HTMLIonMenuElement) => {
  menu.swipeGesture = false;
});

tomskoda on 19 Oct 2018

🎉8 👍2

that works for me.

But, swipeEnable function must work

csotomon on 20 Oct 2018

👍2

The above solution works, but pay attention if you need to reenable on ngOnDestroy, if you use the same method, you must put the code inside a setTimeout, otherwise app will freeze when clicking any link on the menu

matheusdavidson on 2 Nov 2018

👍1

Still same issue

Ionic:

   ionic (Ionic CLI)             : 4.12.0 (npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.2.0
   @angular-devkit/build-angular : 0.13.6
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.3.6
   @ionic/angular-toolkit        : 1.4.1

Cordova:

   cordova (Cordova CLI) : 8.1.2 ([email protected])
   Cordova Platforms     : android 7.1.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.4.1, (and 12 other plugins)

System:

   Android SDK Tools : 26.1.1 (android-sdk)
   NodeJS            : v10.15.1 (nodejs\node.exe)
   npm               : 6.4.1
   OS                : Windows 10

mbaric1 on 10 Apr 2019

I've same problem:

TypeError: Cannot read property 'apply' of undefined
    at fesm5.js:4666
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:391)
    at Object.onInvoke (core.js:17299)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:390)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:150)
    at zone.js:889
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
    at Object.onInvokeTask (core.js:17290)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)

System info

```
Ionic:

ionic (Ionic CLI) : 4.12.0 (/usr/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 4.2.0
@angular-devkit/build-angular : 0.13.8
@angular-devkit/schematics : 7.2.4
@angular/cli : 7.2.4
@ionic/angular-toolkit : 1.2.3

Cordova:

cordova (Cordova CLI) : 8.1.2 ([email protected])
Cordova Platforms : android 7.1.4, browser 5.0.4
Cordova Plugins : cordova-plugin-ionic 5.3.0, cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.4.1, (and 12 other plugins)

System:

Android SDK Tools : 26.1.1 (/home/eddie/Android/Sdk)
NodeJS : v11.14.0 (/usr/bin/node)
npm : 6.7.0
OS : Linux 4.18

blacknode on 22 Apr 2019

I'm experiencing this issue too:

Ionic:

   ionic (Ionic CLI)             : 4.12.0 (C:\Users\marck\AppData\Roaming\nvm\v11.0.0\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.1.2
   @angular-devkit/build-angular : 0.13.7
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.3.7
   @ionic/angular-toolkit        : 1.4.1

Cordova:

   cordova (Cordova CLI) : 9.0.0
   Cordova Platforms     : android 8.0.0
   Cordova Plugins       : cordova-plugin-ionic-webview 3.1.2, (and 9 other plugins)

System:

   Android SDK Tools : 26.1.1 (C:\Users\marck\AppData\Local\Android\Sdk)
   NodeJS            : v11.0.0 (C:\Program Files\nodejs\node.exe)
   npm               : 6.9.0
   OS                : Windows 10

marckassay on 5 May 2019

Same swipeEnable not working on menuCtrl.swipeEnable(false):

controller[methodName] is undefined ;

Ionic:

ionic (Ionic CLI) : 4.12.0
Ionic Framework : @ionic/angular 4.4.0

znotdead on 14 May 2019

This should be fixed in the next Ionic release via https://github.com/ionic-team/ionic/pull/18806. I am going to close this.

kensodemann on 19 Jul 2019

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.