CODEWITHSUNDEEP
androidioscssionic-framework
Stranger
Stranger

Reputation: 10621

Closing/Opening Ionic menu during screen orientation

I'm a newbie to Ionic framework. Is there a way to open the menu on the landscape mode, closing it while it changes to portrait mode and vice versa similar to this one, Hiding the Ionic Framework Header based on screen orientation.

By using,

window.addEventListener("orientationchange", function(){

});

I can able to detect the orientation change but couldn't find a way to hide/show the menu. And is there way to do this using CSS'

/* portrait */
@media screen and (orientation:portrait) {

}
/* landscape */
@media screen and (orientation:landscape) {

}

And if both are possible, which is the preferred way of handling this situation?

Upvotes: 1

Views: 422

Answers (1)

manzapanza
manzapanza

Reputation: 6245

You can use the service $ionicSideMenuDelegate to open or close the menu programatically. 

.controller('AppCtrl', function($scope, $ionicSideMenuDelegate) {
//                                        ˆˆˆˆ injected ˆˆˆˆ 

  window.addEventListener("orientationchange", function(){
    $ionicSideMenuDelegate.toggleLeft(window.orientation !== 0);
  });

})

Remember to inject the service $ionicSideMenuDelegate in your controller. In this example I injected $scope and $ionicSideMenuDelegate in the AppCtrl.

This works on iOS and Android!

Upvotes: 1

Related Questions