Hello guys,
I made an android app with a side menu , it worked fine on the browser but when i tried it on an android device , the menu opens but it never closes.
I have app under development with menu and it was working from last 3-4 months. We didn’t touch menu code and all of sudden same code stopped working with same issue as dadanasro reported. I guess some library version could be issue.
1 Like
What happens if you create and install the default side-menu app on a device?
i.e. is it reproducible?
1 Like
same thing happen when i installed the default side menu app , the menu opens but it never closes
Hi, it would be awesome if you could just copy some code you have, share your ionic info so the problem can be simulated.
1 Like
your routings.ts would be very helpful as well.
1 Like
Well, this works for me very good.
First, I have the menu on app.component.html
<ion-app>
<ion-menu side="start">
<ion-header>
<ion-toolbar>
<ion-title>
Title
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-menu-toggle>
<ion-item lines="none" routerLink="/somePath">
<ion-icon name="business" slot="start"></ion-icon>
<ion-label>item 1</ion-label>
</ion-item>
</ion-menu-toggle>
<ion-menu-toggle>
<ion-item lines="none" routerLink="/somePath">
<ion-icon name="checkbox-outline" slot="start"></ion-icon>
<ion-label>item 2</ion-label>
</ion-item>
</ion-menu-toggle>
<ion-menu-toggle>
<ion-item lines="none" (click)="someAction()" button>
<ion-icon name="exit" slot="start"></ion-icon>
<ion-label>item 3</ion-label>
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
// and then you set your normal ion-router-outlet
<ion-router-outlet main></ion-router-outlet>
</ion-app>
Whenever you want to add the menu button on another .html file, then you just
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button> <!-- see how there are no complicated things here -->
</ion-buttons>
<ion-title>Title</ion-title>
</ion-toolbar>
</ion-header>
Let me know if it worked for you. Is very straightforward.
i don’t think the problem is in my code , bcz i created a new ionic side-menu project and the same problem occured
I have the same issue. Few days ago I installed cordova-android-support-gradle-release and firebase tools. After that all my projects stopped work. Even if I start new project side menu not working. I have Mac OS. I tried to move my project to windows and Linux, all of them works fine.
I tried to delete almost everything (npm, nodejs, cordova, ionic, clean cache, manual deleting folders) and install again nodejs, npm, cordove, ionic. No luck. Every new project broken…
1 Like
Please, see how are your nested html tags are.
I don’t use ion-split-pane and works like a charm. Have you tried get rid of it?
Have you tried my code? Does it work for you?
I guess, it is environment issue, as i have created new component same your code and i have old working code, but both having same issue now only on android . As i haven’t updated any library on my end so not sure what triggered it.
Try if this helps: https://github.com/ionic-team/ionic/issues/19272
1 Like
OK, doesn’t help you directly, but I just created the default side-menu app, and installed it on my Android phone and the menu works fine.
I haven’t installed on a mobile device for a little while and I had to update a few resources to get it to build.
Here is the output of my Ionic Info…
Ionic:
Ionic CLI : 5.1.0 (C:\Users\User\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : @ionic/angular 4.9.1
@angular-devkit/build-angular : 0.801.3
@angular-devkit/schematics : 8.1.3
@angular/cli : 8.1.3
@ionic/angular-toolkit : 2.0.0
Cordova:
Cordova CLI : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : android 7.1.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.1, (and 4 other plugins)
Utility:
cordova-res : 0.6.0
native-run : 0.2.5
System:
Android SDK Tools : 26.1.1 (C:\Users\User\AppData\Local\Android\android-sdk)
NodeJS : v10.16.0 (C:\Program Files\nodejs\node.exe)
npm : 6.9.0
OS : Windows 10
Are you testing on Android Emulator or real Device?
I have the same issue only on Android emulator. It works fine on the browser and on physical devices. Please advise.
in my case the menu stop working (I can’t disable it from login screen to hide the menu) when I install a web component using Ionic styles too, it’s very odd
<ion-menu-button (click)=“openMenu()”>
openMenu() {
this.menu.enable(true, “custom”);
this.menu.open(“custom”);
}
this will force the button to open the menu, solved my problem with this