[bug] $ionicSideMenuDelegate is not automaticly closed on routechange

ionic-v1
1

Hi
i had a problem all my links was on left side menu
so when you open the side menu and click on link to other page (href="#/other")
then on the new page all links become unclickable

after some investigation i noticed that the main content is not getting the transform css property

after playing with it a little i noticed that the “$ionicSideMenuDelegate.isOpenLeft()” is true

so here is my quick fix , i hope its will help anyone having the same issue (i couldn’t find any related topic)

app.run(['$rootScope','$location','$ionicSideMenuDelegate',function($rootScope,$location,$ionicSideMenuDelegate){

        $rootScope.$on('$stateChangeStart',
            function(event, toState, toParams, fromState, fromParams){
          

                if ($ionicSideMenuDelegate.isOpenLeft() == true)
                {
                    $ionicSideMenuDelegate.toggleLeft()
                }
                if ($ionicSideMenuDelegate.isOpenRight() == true)
                {
                    $ionicSideMenuDelegate.toggleRight()
                }

            });

i think its should be as part of the ionic core

there error exists since 1.beta all the way up to 1.beta.7

thanks.

2

Can you try this with the nightly builds? We have since updated to beta 8

3

Same problem on beta 8 as well

4

Alright, do you mind throwing together a codepen to demo this?

5

i thought its private im sending my reply as private message

6

Is there any news on this? Is it intended for the developer to close the side menu after a route/state change?

7

Yes, you should be calling menu-close in you side-menu links. like this demo

http://codepen.io/ionic/pen/tcIGK

8

Ah I see, thanks.

I am not sure if this is a consequence of using the Phonegap Dev app but sometimes I noticed odd behavior. For me, sometimes the sidemenu will close before the state transistion, so it’ll seem like the new state suddenly appears. What I’m doing now is placing this in my .run section of my app:

$rootScope.$on("$stateChangeSuccess", function () {
            if ($ionicSideMenuDelegate.isOpen()) {
                $ionicSideMenuDelegate.toggleLeft();
            }
        });

This way, the menu closes only after the transition. I have no idea if this is a “best practice” approach but it seems to work well. Just thought I’d share my approach, in case it helps someone.

9

whatever element you clicked, you just have to add menu-close to it to close the sidebar.

so if you have a button and you click on it and you want the menu to close on clicking on that button. just add menu-close to that button:

<button ng-click=someaction() menu-close></button>
1 Like