Click on Left side menu item to open right side panel

ionic-v1
1

i am using <item class="item item-icon-left" ng-click="goTo('about')"><i class="icon ion-information"></i>About</item> on the left menu so when i click on About it goes to the right menu. anyone have done this successfully.

1 Like
2

I’m not really understanding you there. Could you clarify a bit more. What does “it goes to the right menu” mean? Do you mean when you click on the “About” item in the left menu, the right menu automatically opens? Or do you mean the page navigates to the “about” state?

3

Shot in the dark, but is this what you were asking about?

1 Like
4

@mhartington yes, thanks. i added

$scope.rightOpen = function() {
	  $scope.sideMenuController.toggleRight();
	};

to the wrong controller.

5

with the new update,

<ion-item nav-clear menu-close class="item item-icon-left" ng-click="rightOpen()"><i class="icon ion-location"></i>Plans</ion-item>

    $scope.rightOpen = function() {
  $scope.sideMenuController.toggleRight();
};

this no longer works. how do i fix this. thanks.

6

Well since 1.0 beta, you have two options now. The easiest way for your situation it seems would be to update the delegate.

$scope.rightOpen = function() {
 $ionicSideMenuDelegate.toggleRight();
}

Or this built in directive that came with 1.0

 menu-toggle="right"

If you need any more info, take a look at the docs. They’ve been doing a great job keeping everything documented.

http://ionicframework.com/docs/api/directive/ionSideMenus/

7

yeah, i followed the docs. somehow is not working.

index.html
 	<!-- Right menu -->
    <ion-side-menu side="right">
		<ng-include src="#/app/plans.html"></ng-include>
    </ion-side-menu>

menu.html
    <ion-item nav-clear menu-close class="item item-icon-left" ng-click="rightOpen()"><i class="icon ion-location"></i>Plans</ion-item>

app.js
       angular.module('plans.controllers', [])
    
    .controller('AppCtrl', function($scope, $ionicSideMenuDelegate) {
    	$scope.rightOpen = function() {
    		$ionicSideMenuDelegate.toggleRight();
    	};
    })
    
    .controller('PostsCtrl', function($scope) {
    
      $scope.playlists = [
        { title: 'Reggae', id: 1 },
        { title: 'Chill', id: 2 },
        { title: 'Dubstep', id: 3 },
        { title: 'Indie', id: 4 },
        { title: 'Rap', id: 5 },
        { title: 'Cowbell', id: 6 }
      ];
    })
    
    .controller('PostCtrl', function($scope, $stateParams) {
    })
8

i know a few people still have a problem with this. any updates?

9

Hey @rdtran sorry I took so long to get back to you, things have been busy on my side. I put this together to show that you can still toggle the right menu from the left menu

.controller('eventmenuCtrl', function($scope, $ionicSideMenuDelegate) {
  $scope.toggleright = function() {
    $ionicSideMenuDelegate.toggleRight();
  };
  
});
10

thanks. i feel stupid again, not paying attention to the menu-close (delete it).