Open side menu at app launch

ionic-v1
1

I am struggling with a simple task:

When the app is launched I want it to open the side menu, I can’t get it to work.
I tried

ionic.Platform.ready(function () {
   $ionicSideMenuDelegate.toggleLeft();
});

and also

$timeout(function() {
   $ionicSideMenuDelegate.toggleLeft();
});

in the app controller.
None of them work. Any ideas?

$ionicSideMenuDelegate is of course fed to my controller.

2

While $ionicSideMenuDelegate is definitely the delegate for side menus, it doesn’t know which side menu you want to address and it seems it doesn’t just work on the first side menu it finds in it’s context.

Follow the docs… Either use

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

or

$ionicSideMenuDelegate.$getByHandle(‘my-handle’).toggleLeft();

if you understand what the handle refers to… (in that case, tell me too! I didn’t get what the handle is… Class? Id?)

1 Like
3

Both do not work. When I execute $scope.toggleLeftSideMenu() or $ionicSideMenuDelegate.$getByHandle('my-handle').toggleLeft(); in the ionic.Platform.ready or in the $timeout, both do not work.

I don’t know what the problem is…

To your question: you can set the delegate-handle in the <ion-side-menus>, look up ionSideMenu.

However this does not work…
Question remains: How to open the side menu when the app launches?

4

Seems like it works pretty well over here.

.controller('homeCtrl', function($scope, $ionicSideMenuDelegate){
  ionic.Platform.ready(function () {
    $ionicSideMenuDelegate.toggleLeft();
  });

})
4 Likes
5

i have the same problem, the solution is just to put

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

in the app.js

angular.module(‘starter.controllers’, [])
.controller(‘AppCtrl’, function($scope, $ionicModal, $timeout,$ionicSideMenuDelegate,$state) {

//icons.wth
// With the new view caching in Ionic, Controllers are only called
// when they are recreated or on app start, instead of every page change.
// To listen for when this page is active (for example, to refresh data),
// listen for the $ionicView.enter event:
//$scope.$on(’$ionicView.enter’, function(e) {
//});
$scope.toggleLeft = function() {
$ionicSideMenuDelegate.toggleLeft();
}
// Form data for the login modal
$scope.loginData = {};

// Create the login modal that we will use later
$ionicModal.fromTemplateUrl(‘templates/login.html’, {
scope: $scope
}).then(function(modal) {
$scope.modal = modal;
$scope.modal.show();
});

// Triggered in the login modal to close it
$scope.closeLogin = function() {
$scope.modal.hide();

 $ionicSideMenuDelegate.toggleLeft();

// sideMenuService.openSideMenu(‘sideMenu’);
// $state.go(‘leftMenu’);
};

// Open the login modal
$scope.login = function() {
$scope.modal.show();
};

// Perform the login action when the user submits the login form
$scope.doLogin = function() {
console.log(‘Doing login’, $scope.loginData);

// Simulate a login delay. Remove this and replace with your login
// code if using a login system
$timeout(function() {
  $scope.closeLogin();
}, 1000);

};
})