Ionic - How to remove sidemenu on login page only?

Question

I need to remove sidemenu only on my login page. Otherwise remain. How it can be done? I\'m using command ionic ionic start myApp sidemenu to create the project

Answer 1

I know this is late but here is a quick and easy solution.

Add this in your login Controller

$scope.$on('$ionicView.afterEnter', function(event) {
    $ionicSideMenuDelegate.canDragContent(false);
});
//enable side menu drag before moving to next view
$scope.$on('$ionicView.beforeLeave', function(event) {
    $ionicSideMenuDelegate.canDragContent(true);
});

Answer 2

You have to watch the slide menu. If it is open, you have to toggle it and close.

 .controller('kayTOlCtrl', function($scope,$ionicSideMenuDelegate) {
     //
     $scope.$watch(function () {
            return $ionicSideMenuDelegate.getOpenRatio();
        },

                    function (ratio) {
                        if (ratio != 0) {
                          $ionicSideMenuDelegate.toggleRight();

                        }

                    });
    })

Answer 3

Calling $ionicSideMenuDelegate.canDragContent(false) does disable the ability to swipe to access the menu, but does not hide the hamburger toggle button in the navbar (if you have one). To do that, you can use ng-show with $root binding in your ion-side-menu-content element like this:

  <ion-nav-buttons side="left">
    <button class="button button-icon button-clear ion-navicon" menu-toggle="left"
      ng-show="$root.showMenuIcon">
    </button>
  </ion-nav-buttons>

Then in your login controller:

$scope.$on('$ionicView.beforeEnter', function (event) {
  $scope.$root.showMenuIcon = false;
  $ionicSideMenuDelegate.canDragContent(false);
});

$scope.$on('$ionicView.beforeLeave', function (event) {
  $scope.$root.showMenuIcon = true;
  $ionicSideMenuDelegate.canDragContent(true);
});

Answer 4

A little late to the game but this is another option for those (like me) who need to keep their login view within the side-menu layout but need to hide the side menu button while keeping the view title.

Inside the login.html view use the ion-header-bar directive to create a new header with a title and then hide the ion-nav-bar in the side-menu layout via the ion-view tag.

Example (login.html)

<ion-header-bar class="bar-positive" align-title="center">
    <h1 class="title">Login</h1>
</ion-header-bar>

<ion-view hide-nav-bar="true">
 <!-- Login content goes here -->
</ion-view>

Then if you need to disable any drag gestures do so in the controller like @waqas suggests.

Answer 5

You can disable/enable sidemenu at any time at any page by calling

$ionicSideMenuDelegate.canDragContent(false)

e.g:

angular.module('ABC').controller('xyzCtrl', function($scope, $ionicSideMenuDelegate) {

    $ionicSideMenuDelegate.canDragContent(false)

});