menu-close is an attribute directive that closes a currently opened side menu. Note that by default, navigation transitions will not animate between views when the menu is open. Additionally, this directive will reset the entering view’s history stack, making the new page the root of the history stack. This is done to replicate the user experience seen in most side menu implementations, which is to not show the back button at the root of the stack and show only the menu button. We recommend that you also use the enable-menu-with-back-views="false" ionSideMenus attribute when using the menuClose directive.


Below is an example of a link within a side menu. Tapping this link would automatically close the currently opened menu.

<a menu-close href="#/home" class="item">Home</a>

Note that if your destination state uses a resolve and that resolve asynchronously takes longer than a standard transition (300ms), you’ll need to set the nextViewOptions manually as your resolve completes.

 historyRoot: true,
 disableAnimate: true,
 expire: 300