Side menu controller: how to close it from within the side panel


#1

I can access the toggleLeft() function from $ionicSideMenusController in the main content window (FYI the documentation still has the old name which is sideMenuController). But how can I access that from the side menu?

Eg in this example what if we want the panel to close when clicking the “Attendees” link?
http://codepen.io/ionic/pen/tcIGK

thanks,
Damien


#2

Just searching for the same answer. Can anyone help us please? Thanks


#3

Note that using the nightly build is dangerous right now … :slight_smile:

<a href="#/event/attendees" class="item" ng-click="$ionicSideMenusController.toggleLeft()">
  Attendees
</a>

We will be releasing a new version soon and things will stable out more, though!


#4

That work for simple cases, but I would like to wrap that in a function so that I can do other things. When I try ng-click=“test()” and then put that in a function I can’t seem to find the $ionicSideMenusController object anymore. Is there a way to inject it into the controller?

 $scope.test = function() {
    $scope.$ionicSideMenusController.toggleLeft();
  };

updated to show this: http://codepen.io/anon/pen/nxkHJ


#5

Thanks. How can we do it from the controller? I have this:

.controller(‘MainCtrl’, function ($scope, $ionicSideMenuDelegate, $location,…

I have some logic and use $location to redirect when user click on menu options.
But I need to close the left menu from the controller. Thanks


#6

You two are using different versions!

@damienleri - Your controller’s scope is above your sideMenu - we are fixing this whole problem in nightly very soon, within the next day - stay tuned

@Shote try $ionicSideMenuDelegate.toggleLeft()?


#7

It was my first try.

Error: $scope is undefined .toggleLeft@http://localhost:59699/CisionRadar/www/lib/js/ionic.bundle.js:31958 $scope.selectItem@http://localhost:59699/app/www/js/controllers.js:25 Parser.prototype.functionCall/<@http://localhost:59699/app/www/lib/js/ionic.bundle.js:17204 @http://localhost:59699/app/www/lib/js/ionic.bundle.js:34517 $RootScopeProvider/this.$get</Scope.prototype.$eval@http://localhost:59699/app/www/lib/js/ionic.bundle.js:18961 $RootScopeProvider/this.$get</Scope.prototype.$apply@http://localhost:59699/app/www/lib/js/ionic.bundle.js:19061 @http://localhost:59699/app/www/lib/js/ionic.bundle.js:34516 createEventHandler/eventHandler/<@http://localhost:59699/app/www/lib/js/ionic.bundle.js:9600 forEach@http://localhost:59699/app/www/lib/js/ionic.bundle.js:7294 createEventHandler/eventHandler@http://localhost:59699/app/www/lib/js/ionic.bundle.js:9599 ionic.tapElement@http://localhost:59699/app/www/lib/js/ionic.bundle.js:2120 onTap@http://localhost:59699/app/www/lib/js/ionic.bundle.js:34507 triggerEvent@http://localhost:59699/app/www/lib/js/ionic.bundle.js:606 tapGesture@http://localhost:59699/app/www/lib/js/ionic.bundle.js:1502 detect@http://localhost:59699/app/www/lib/js/ionic.bundle.js:1184 bindDomOnTouch@http://localhost:59699/app/www/lib/js/ionic.bundle.js:733

return logFn.apply(console, args);

ionic.bundle.js (line16419)


#8

Did you try passing $scope in?


#9

It’s there:

.controller(‘MainCtrl’, function ($scope, $ionicSideMenuDelegate, $location,…

I will change my code… and this option will do it…

Thanks


#10

Hi @Shote,

I meant into the $ionicSideMenuDelegate.

$ionicSideMenuDelegate.toggleLeft($scope);

This will all be much clearer very soon - sorry for the troubles :slight_smile:


#11

@andy
The nightly has this fixed already?

I’m also experiencing something very similar. Basically, when I click on Side Menu “item”, it should close the side menu but it leaved it open. Seems like a similar issue.

Thanks,


#12

@sixpenrose16 This works in nightly.

Check out the wip docs here (should be up on main website & version released before the next day if all goes to plan): http://ajoslin.github.io/docs/nightly/api/service/$ionicSideMenuDelegate


#13

Confirmed it works for me with the nightly now. Much appreciated!


#14

@andy
I tried it to see if this was fixed in Beta, it seems to be an issue still.


#15

@sixpenrose16 here is what I did:

.controller('blah', function($scope, $ionicSideMenuDelegate) {

	$scope.toggle_left_side_menu = function() {
	    $ionicSideMenuDelegate.toggleLeft();
	}; 

}

#16

There is the menu-close directive that you can put on your side menu links that automatically will close the active side menu. http://ionicframework.com/docs/api/directive/menuClose/