FGF-College-Work / Forum

:beer: Espaço dedicado a discussões e tira dúvida sobre disciplinas e conteúdo tecnológico.
MIT License
13 stars 4 forks source link

Disable side menu on login page conference app #145

Open marcialwushu opened 5 years ago

marcialwushu commented 5 years ago

Disable side menu on login page conference app

MenuController

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

@Component({
  templateUrl: 'page-one.html'
})
export class PageOne {
  activeMenu: string;

  constructor(public menu: MenuController) {
    this.menu1Active();
  }

  menu1Active() {
    this.activeMenu = 'menu1';
    this.menu.enable(true, 'menu1');
    this.menu.enable(false, 'menu2');
  }

  menu2Active() {
    this.activeMenu = 'menu2';
    this.menu.enable(false, 'menu1');
    this.menu.enable(true, 'menu2');
  }
}

See the MenuController API Docs for more usage info and a live demo: http://ionicframework.com/docs/api/components/app/MenuController/

marcialwushu commented 5 years ago

How can I completely hide/disable/remove the menu on the login page?

import {IonicApp, Page, NavController, MenuController} from 'ionic/ionic';
import {TabsPage} from '../tabs/tabs';
import {SignupPage} from '../signup/signup';
import {UserData} from '../../providers/user-data';

@Page({
  templateUrl: 'build/pages/login/login.html'
})
export class LoginPage {
  constructor(nav: NavController, userData: UserData, menu: MenuController) {
    this.nav = nav;
    this.userData = userData;

    this.login = {};
    this.submitted = false;

    this.menu = menu;

  }

  onLogin(form) {
    this.submitted = true;

    if (form.valid) {
      this.userData.login();
      this.nav.push(TabsPage);
    }
  }

  onSignup() {
    this.nav.push(SignupPage);
  }

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

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

}
marcialwushu commented 5 years ago

I got rid of the swipe effect by adding the following

.menu.swipeEnable(false);

and I was able to remove the menu button/icon by removing the following markup from the login.html file

<button menuToggle>
    <ion-icon name="menu"></ion-icon>
</button>

I was under the impression that this.menu.enable(false) would take care of everything

Menu side is defined with side property:

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

You could try to implement some method which updates this property based on your needs.

marcialwushu commented 5 years ago

https://forum.ionicframework.com/t/disable-side-menu-on-login-page-conference-app/38061/10

marcialwushu commented 5 years ago

I subscribe to an event in ngOnInit method, and publish that same event when clicking a button. But nothing seems to happen.

import { Events } from '@ionic/angular';
export class LoginPage implements OnInit {
  constructor(public events: Events) { }
  ngOnInit(){
    this.events.subscribe('testevent', (data) => {
      console.log('testevent');
      console.log(data);
    });
  }
  publishEvent(){
    console.log('shouldPublishEvent');
    this.events.publish('testevent', {key: 'value'});
  }
}

Ignore the above I had imported

import { Events } from 'ionic-angular'

not as

import { Events } from '@ionic/angular';