Ionic 2 - Disable side menu in log in page

Question

I intend to disable the swipe gesture for the side menu in the log in page. The only change I made is importing the MenuController and set swipeEnable to false in the constructor.

However, after running it, I keep getting a syntax error: Unexpected token (18:47) while parsing file.

import {App, Page, NavController, Nav,NavParams, IonicApp, Storage, LocalStorage, MenuController } from 'ionic-angular';
import {httpService} from '../../services/httpService';
import {HelloIonicPage} from '../hello-ionic/hello-ionic';
import {GettingStartedPage} from '../getting-started/getting-started';
import {SettingsPage} from '../settings/settings';

@Page({
  templateUrl: 'build/pages/log-in/log-in.html',
  providers: [httpService]
})

export class LoginPage {

  static get parameters(){
     return [[NavController],[httpService],[MenuController]];
   }

   constructor(navController, httpService, menu: MenuController) {

     this.menu = menu;
     this.navController = navController;
     this.httpService = httpService;
     this.local = new Storage(LocalStorage);
     this.menu.swipeEnable(false);
   }
}

Thanks in advance.

Answer 1

The following worked for me on Ionic2 v.2.2.0

1. Open src/app/app.html and add an ID to your <ion-menu> element

So that this,

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

Becomes this.

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

2. Open login.html and remove the <ion-navbar> code from <ion-header> so that the menu will not display on the page.

3. Open login.ts and import the MenuController from ionic/angular.

In the constructor set enable() on MenuCtrl to false and add the menu ID as the second parameter. Even though the menu isn't showing, doing this will prevent the user from swiping to open the menu.

Example login.ts

import { Component } from '@angular/core';
import { NavController, MenuController } from 'ionic-angular';

@Component({
  selector: 'page-login',
  templateUrl: 'login.html'
})
export class LoginPage {

  constructor(
    public navCtrl: NavController,
    public menuCtrl: MenuController
  ) {
    this.menuCtrl.enable(false, 'myMenu');
  }
}

Answer 2

import {  MenuController } from 'ionic-angular';

constructor(....... ........ .......... .......,private menu : MenuController)


ionViewDidEnter() {
    // the root left menu should be disabled on this page
    this.menu.enable(false);
  }

  ionViewWillLeave() {
    // enable the root left menu when leaving this page
    this.menu.enable(true);
  }

this will hide the menu