Hi everyone
So I’ve just discovered a weird issue with my mobile web app (not native): when someone drills down in to a sub menu page using the left-sided slide out menu, and then hits their browser’s back button, the previous view slides in from the right and not the left as one would expect, and the hamburger menu icon disappears from the nav header. Not only this but, if they try to reveal the browser with a swipe - left it appears as though the browser’s in-built behaviour takes over (tries to go back to the previous view).
I’ve got a feeling this is going to completely scuttle my client project just days before it goes live 
Cheers for any help!
relevant index code:
`
`
side menu is declared as:
<ion-side-menus enable-menu-with-back-views="false"> <ion-side-menu-content> <ion-nav-bar class="bar-stable"> <ion-nav-back-button></ion-nav-back-button> <ion-nav-buttons side="left"> <button class="button button-icon button-clear ion-navicon" menu-toggle="left"></button> </ion-nav-buttons> </ion-nav-bar> <ion-nav-view name="menu"></ion-nav-view> </ion-side-menu-content> <ion-side-menu side="left" id="menuSide"> <ion-header-bar class="bar-dark"> <div class="title">Menu</div> </ion-header-bar> <ion-content padding="false" class="side-menu-left has-header"> <ion-list id="menuList" class=" "> <ion-item id="menu-1" ui-sref="menu.a" menu-close class=" ">item 1</ion-item> <ion-item id="menu-2" ui-sref="menu.b" menu-close class=" ">item 2</ion-item> <ion-item id="menu-3" ui-sref="menu.c" menu-close class=" ">item 3</ion-item> <ion-item id="menu-4" ui-sref="menu.d" menu-close class=" ">item 4</ion-item> <ion-item id="menu-5" ui-sref="menu.e" menu-close class=" ">item 5</ion-item> <ion-item id="menu-6" ui-sref="menu.f" menu-close class=" ">item 6</ion-item> <ion-item id="menu-7" ui-sref="menu.g" menu-close class=" ">item 7</ion-item> <ion-item id="menu-8" ui-sref="menu.h" menu-close class=" ">item 8</ion-item> </ion-list> </ion-content> </ion-side-menu> </ion-side-menus>
try to use event.preventDefault() in your controller function
Thanks for the reply, I’m really stressing here. I know from my general JS experience that using preventDefault needs to be attached to an event - as your example shows. But where would I put this script? I’m not aware of a way to attach a listener to the web browser’s hardware back button in order to grab the event and stop it.
use $routeChangeStart and try to detect state if it is found to be backword state then block the transition
Okay I see where you’re going with that. I don’t know how to decide if the state is in a “backward state” as you put it, but at least it’s somewhere to start. If I can just trap a hardware back button specifically and redirect to the home page maybe, I’ll be happy and extremely relieved. Thanks for the pointer @baviskarmitesh - fingers crossed!
[Edit] I think I now understand the cause behind the behaviour I originally reported; my side menu items all define the menu-close directive, and according to the docs this forces Ionic to completely erase the history stack and set the new view as the root (awesome eh!). So when the back button is pressed, and there’s no history stack available, I think the browser takes over and does whatever it can - which isn’t great as it turns out.
There’s a work-around of sorts that I have found so far but I’m not exactly thrilled with it - changing menu-close to menu-toggle and setting enable-menu-with-back-views="true" on the side menu. The upshot of this is that a) the transition to sub views is awful (you can visibly see the underlying view move as the menu closes), and the subsequent pages all have both a back button and a menu icon. Or leaving enable-menu-with-back-views="false" and then adding hide-back-button="false" to each sub view - this then only shows the back button and hides the menu button. again, not perfect, but at least it works.
As I say it’s not a great solution but at least it allows hardware back buttons to not break the app. Next idea is to look at the ionic code and see if i can disable the history clearing mechanism when using menu-close (such fun!).