title: angularjs ng-show: Hide Sign-in option after successful login
body: <p>I'm trying to hide the Sign-In option on the navigation bar once the user logs in successfully. I tried to do it the way explained in the following link, but the Sign-in option is still visible even after the user logs in.</p>
  
  <pre><code>http://stackoverflow.com/questions/22694536/angularjs-ng-hide-with-different-ng-controller
  </code></pre>
  
  <p>Any help would be greatly appreciated.
  Thanks in advance.</p>
  
  <p>Here is the application.js and index.html </p>
  
  <p>application.js</p>
  
  <pre><code>myApp.controller('NavbarController', [
  '$scope',
  '$location',
  '$modal',
  '$rootScope',
  'navservice',
  '$window',
  function ($scope, $location, $modal, $rootScope, navservice, $window) {
  
  init();
  
  function init() {
      navservice.hideSignIn($scope, $location);
  };
  
      $scope.doCollapse = function() {
         $scope.isCollapsed=!$scope.isCollapsed;
      };
  
      $scope.$on('EventFromSigninController',function(data){
          $scope.signedin = data.signedin;
  });
  }, 
  ]);
  
  myApp.service('navservice', function () {
          this.hideSignIn = function ($scope, $location) {
          if (null != username &amp;&amp; 0 != username.length &amp;&amp; 
                       null != password &amp;&amp;  0 != password.length) {
              $scope.signedin = true;
          } else {
              $scope.signedin = false;
          }
      };
  });
  
    myApp.controller('SignInController', [
     '$scope',
     '$modal',
     'navservice',
     '$window',
      function ($scope, $modal, navservice, $window) {
    var signedIn2 = true; 
    $scope.dblclick = function() {
     //change the local tableHideAlias state
     signedIn2 = !signedIn2;
  
     // emit the new hideAlias value
     $scope.$emit('EventFromSigninController',{signedIn: signedIn2}); 
    };      
       },
     ]);
  </code></pre>
  
  <p>index.html</p>
  
  <pre><code>&lt;nav class="hidden-xs" role="navigation"&gt;
  &lt;ul class="nav navbar-nav" data-ng-controller="NavbarController"&gt;
  &lt;a href="#/home" role="button" class="navbar-brand navbar-band-pad"&gt;
  &lt;img src="img/sampleimg.png" alt="logo"&gt; 
  &lt;/a&gt;
  
  
  &lt;li data-ng-class="{'active':getClass('/home')}"&gt;&lt;a href="#/"&gt;Home&lt;/a&gt;&lt;/li&gt;
  &lt;li class="dropdown"&gt;
  &lt;a href="#" role="button" class="dropdown-toggle"&gt;
  Accounts &lt;b class="caret"&gt;&lt;/b&gt;
  &lt;/a&gt;
  
  &lt;ul class="dropdown-menu"&gt;
  &lt;li&gt;&lt;a ng-click="signOut()"&gt;Sign Out&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;ul class="nav navbar-nav navbar-right" data-ng-controller="NavbarController"  ng-   hide="signedin"&gt;                          
  &lt;li id="signinele" data-ng-class="{'active':getClass('/signin')}" data-ng-  controller="SignInController" ng-dbclick="dblclick()"&gt; 
  &lt;a href="#/signin"&gt;Sign In&lt;/a&gt;
  &lt;/li&gt;                                                                         
  &lt;/ul&gt;                                                             
  &lt;/nav&gt;
  </code></pre>