简体   繁体   中英

Modify value of ng-show from true to false once redirected to home page from login page in angularjs

I'm newbie to angularjs and had a problem to solve where I had to modify the value of ng-show="false" to ng-show="true" when user is redirected to home page after he/she is logged in successfully!!

here is what i'm trying to do:

.controller('loginCtrl', function ($scope, ..., showmenu)
{
      $scope.dropdown = showmenu.hide;
      ....
}
.factory('showmenu', function() {
  return {
      show : 'true',
      hide : 'false'
  }
})

index.html

<div class="btn-group" dropdown="" ng-show="false">
  <button type="button" class="btn btn-danger">Kyle Thomas</button>
  <button type="button" class="btn btn-danger dropdown-toggle">
    <span class="caret"></span> <span class="sr-only">Split
      button!</span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#/profile">Profile</a></li>
    <li><a href="#/setting">Setting</a></li>
    <li><a href="#/help">Help</a></li>
    <li class="divider"></li>
    <li><a href="#/login">Logout</a></li>
  </ul>
</div>

this drop down should show when redirected to home.html!!

Thanks

I think you are using ng-show value directly as false . when scope updates the value not changed. so use the $scope.dropdown in ng-show

<div class="btn-group" dropdown="" ng-show="dropdown">
  <button type="button" class="btn btn-danger">Kyle Thomas</button>
  <button type="button" class="btn btn-danger dropdown-toggle">
    <span class="caret"></span> <span class="sr-only">Split
      button!</span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#/profile">Profile</a></li>
    <li><a href="#/setting">Setting</a></li>
    <li><a href="#/help">Help</a></li>
    <li class="divider"></li>
    <li><a href="#/login">Logout</a></li>
  </ul>
</div>

here the value of ng-show changes angular automatically handle the ng-hide directive.

if ng-show ="true" it shows the html
if ng-show = "false" it hides the html. here no need of ng-hide. 

In your controller set the $scope.dropdown = false; first . It hides the html . when user logins into your app change the value of $scope.dropdown = true; it shows the html

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM