Ionic + android back button + sidemenu isOpen detection - doesn't work reliably
I have a strange situation. I am writing an ionic angular + app with a left slide menu and this is what I am trying to do:
1) Android back button trap 2) When you press the back button, if the menu is not open, go to the menu (open it) 3) If the menu is open and you press the back button, exit the application
To catch the back button I have this code in app.run (also tried to translate to base controller and injected with $ controller in other controllers, doesn't matter)
What I notice is that if I actually click the "menu icon" in the menu, "isOpen" reliably prints true / false alternately as I open and close the menu
But when I press the android back button it works the first time (prints true or false), but each subsequent response does not change the isOpen state, and the menu actually switches.
So it doesn't allow me to programmatically determine if the menu is open or closed in the android feedback button handler.
It confuses me why this is only an android reverse handler problem and not a problem when clicking on a menu item. This is the same code that is called in both cases, which
$ionicSideMenuDelegate.toggleLeft();
My android handler code:
$ionicPlatform.registerBackButtonAction(function (event) {
$ionicSideMenuDelegate.toggleLeft();
$ionicSideMenuDelegate.$getByHandle('sideMenu').toggleLeft();
$timeout ( function() {
console.log ("Status of SIDE MENU IS : " + $ionicSideMenuDelegate.$getByHandle('sideMenu').isOpen());
},1000);
}, 100);
I also installed the encoder, although not sure how it can be tested on an android device because every time I try to click on the arrow button or jsfiddle it makes the browser return the page.
Any insight on what's going on? I asked on the ionic forum but couldn't figure out why (yet) -> hence a post to the SO community in the hopes it reaches a wider audience.
source to share
registerBackButtonAction
priority is required to override other actions:
Priorities for existing back button buttons: Return to Previous View = 100 Close Side Menu = 150 Reject modal = 200 Close Action Sheet = 300 Remove Popup = 400 Reset Overlay Load = 500
The Back button action cancels all of the above actions. the priority is less than the priority you are granting. For example, an action assigned priority of 101 will override "return to previous view" action, but not any other action.
I have tested this code and it works as expected:
.run(function($ionicPlatform, $ionicSideMenuDelegate, $ionicPopup) {
$ionicPlatform.registerBackButtonAction(function(e) {
e.preventDefault();
if (!$ionicSideMenuDelegate.isOpenLeft()) {
$ionicSideMenuDelegate.toggleLeft();
} else {
navigator.app.exitApp();
}
}, 1000);
});
As you can see, I used a priority of 1000 to make sure I override all the default actions.
I also used preventDefault()
. I don't think you need this, but just in case.
This bit of code only works in the left menu as I only check:
$ionicSideMenuDelegate.isOpenLeft()
and only open the left one:
$ionicSideMenuDelegate.toggleLeft()
but you can change it to work with the right menu .
UPDATE
If anyone is interested in learning more about Android and Back Button, this is the best article I have read so far.
source to share