title: How to ng-hide login button after successful login Ionic?
body: <p>I have started sideMenu app in ionic and tried some implementation. Initially, ionicModal is used to show login so i change it with ion-list item like;</p>
  
  <pre><code>&lt;ion-side-menu side="left" &gt;
      &lt;ion-header-bar class="bar-stable  bar-dark"&gt;
        &lt;a ng-click="redirectToWeb()" &gt; &lt;h1 class="title"&gt;NerdApp&lt;/h1&gt;&lt;/a&gt;
      &lt;/ion-header-bar&gt;
      &lt;ion-content &gt;
        &lt;ion-list  class="BGcolorDG"&gt;
          &lt;ion-item nav-clear menu-close class="BGcolorDG item item-icon-left item-content-modified" href="#/app/login" ng-show="control.showLogin" &gt; &lt;!--ng-click="login()" --&gt;
            &lt;i class="icon ion-locked"&gt;&lt;/i&gt; &lt;span&gt;Login&lt;/span&gt;
          &lt;/ion-item&gt;
          &lt;ion-item nav-clear menu-close href="#/app/search" class="item item-icon-left BGcolorDG item-content-modified"&gt;
              &lt;i class="icon ion-search"&gt;&lt;/i&gt;&lt;span&gt;Search&lt;/span&gt;
          &lt;/ion-item&gt;
          &lt;ion-item nav-clear menu-close href="#/app/browse" class="item item-icon-left BGcolorDG item-content-modified"&gt;
              &lt;i class="icon ion-ios-browsers"&gt;&lt;/i&gt;&lt;span&gt;Browse&lt;/span&gt;
          &lt;/ion-item&gt;
          &lt;ion-item nav-clear menu-close href="#/app/playlists" class="item item-icon-left BGcolorDG item-content-modified"&gt;
              &lt;i class="icon ion-music-note"&gt;&lt;/i&gt; &lt;span&gt;Playlists&lt;/span&gt;
          &lt;/ion-item&gt;
        &lt;/ion-list&gt;
      &lt;/ion-content&gt;
    &lt;/ion-side-menu&gt;
  </code></pre>
  
  <p>and provide routeState as</p>
  
  <pre><code>state('app', {
    url: "/app",
    abstract: true,
    templateUrl: "templates/menu.html",
    controller: 'AppCtrl'
  })
  .state('app.login', {
        url: "/login",
        views: {
            'menuContent': {
                templateUrl: "templates/login.html",
                controller: "LoginCtrl"
            }
        }
    })
  .state('app.home', {
        url: "/home",
        views: {
            'menuContent': {
                templateUrl: "templates/home.html",
                controller: "HomeCtrl"
            }
        }
  })
  </code></pre>
  
  <p>And default route to home controller.</p>
  
  <pre><code> $urlRouterProvider.otherwise('/app/home');
  </code></pre>
  
  <p>the app controller is as</p>
  
  <pre><code>.controller('AppCtrl', function($scope,$timeout,$location,$rootScope) {
           $scope.control = {
              showLogin:true
          };
  
          if($rootScope.showLogin != undefined &amp;&amp; $rootScope.showLogin == false){
              $scope.control.showLogin = false;
          }           
  })
  </code></pre>
  
  <p>Inside loginControl i am checking and redirecting it back to home controller as  </p>
  
  <pre><code>$scope.login = function() {
              if ($scope.loginData.username == 'hassaan' &amp;&amp; $scope.loginData.password == 'khan') {
                  $rootScope.showLogin = false;
                //  $location.path('#/app');
                  $state.go('app.home');
              }else{
              alert('Incorrect credentials');
              }
          }
  </code></pre>
  
  <p>i have tried both $location.path and $state.go and what its doing is redirecting to home page but 'not showing the sidemenu' and when i inspect in browser it showing sidemenu hidden.</p>
  
  <p>The flow images of test app is as </p>
  
  <p><img src="https://i.stack.imgur.com/vLAFB.jpg" alt="Initial View"></p>
  
  <p><img src="https://i.stack.imgur.com/fqo2b.jpg" alt="Side Menu Showing">
  <img src="https://i.stack.imgur.com/j7ify.jpg" alt="Login">
  <img src="https://i.stack.imgur.com/Y9zch.jpg" alt="After login sidemenu hiding"></p>