Ionic 2 - Page freeze after navCtrl.setRoot(LoginPage)


#1

Hello everyone,

I started to create an app with Ionic 2 and playing with Ionic Auth login/logout.

I started my project with a side menu and added a LoginPage and a logout link in the side menu.

However, when I click on logout and then navigate to the LoginPage, the LoginPage seems like it’s frozen. I can’t click on fields.

My github repo : https://github.com/paoesco/walkingdog/tree/master/walkingdog-mobile

My app component with the logout method : https://github.com/paoesco/walkingdog/blob/master/walkingdog-mobile/src/app/app.component.ts

My login page : https://github.com/paoesco/walkingdog/blob/master/walkingdog-mobile/src/pages/login/login.ts

I don’t understand why it is frozen…

If you need to build the app, it’s just npm install and ionic serve.
You can login with test@walkindog.com / test

Thank you very much for your support !


#2

Hi !

I up this topic as I can’t understand why it’s happening.

Thanks


Errror when setting page as rootPage : Uncaught TypeError: Cannot read property 'ev' of null
#3

Take a look in this and in opened issue


#4

Hi .@paoesco Did anyone find a solution for this? I am currently using Ionic 2.0.0-rc.4 and I face the same issue


#5

@paoesco @Pisix and anyone having this issue, if your app has a menu when logged and doesn’t have it when the user is not logged, it may be due to the css applied to the ion-content (.menu-content-open ion-content -> pointer-events: none;). It happened in my case; if I comment this css everything works fine. This css is not the problem, but the fact that the menu is opened (or better, the app think it is opened, but there is no menu). If this is your case, and you hide the menu with ngIf, try to use hidden instead:

Instead of:

<ion-menu *ngIf="showMenu" [content]="content">

do:

<ion-menu [hidden]="!showMenu" [content]="content">

In my case I was only receiving this error on Android and tought to be an Android specific issue, but that was because the menu was showing always in the split pane in the browser (because the screen is larger, the menu doesn’t show blocking the page behind it, but instead it always appears next to the page, to the left). When I tested logout with small screen width the same error ocurred in browser.

If after the logout the first click doesn’t work (the next clicks should work), the app may be seeing the menu as opened (even tough it’s hidden). You could add some code like the one below to manually close the menu in that case.

import { MenuController } from 'ionic-angular';

constructor(private menuCtrl: MenuController) {}

...

handleShowState() {
	let showMenu = this.someService.isLogged();
	
	if (this.showMenu && !showMenu) {
		this.menuCtrl.close();
	}
	
	this.showMenu = showMenu;
}