1

I want to show Login and Logout button according to $rootScope variable. But it show always Logout in li tag which mention in below. I do some stuff on some events are:-

After Login:-

$rootScope.userData = response.userdata;//response.userdata is Object

After Logout:-

delete $rootScope.userData;
$rootScope.userData = null;

Controller:-

console.log($rootScope.userData);//Object {}

Html:-

<li ng-if="$root.userData == null"><a href="#/login"><i class="fa fa-lock"></i> Login</a></li>
<li ng-if="$root.userData != null"><a href="#/logout"><i class="fa fa-lock"></i> Logout</a></li>
Improve this question
2
  • We need more context, what is $root? Can you set up a jsFiddle? Commented Aug 12, 2015 at 5:45
  • I need Login or Logout work as toggle according to $rootScope variable. Code in jsFiddle jsfiddle.net/clsah/L1qfLo9e Commented Aug 12, 2015 at 6:06

2 Answers 2

Reset to default
1

login ng-if="!$root.userData.length"

logout ng-if="$root.userData.length"

I recommend you to create a MainController and load loggedin data into a model, say user and add that MainController to your <body> tag, so that you can have access to loggedin user everywhere rather than adding this to rootScope.

You can create a service that can tell if user is loggedin and return data. In this way you can also have another model called isAuthenticated that can have true or false by checking login status using that service. Then you can only do ng-if="isAuthenticated" and ng-if="!isAuthenticated"

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

Use ng-show instead of ng-if..

Improve this answer

1 Comment

check above js fiddle link. I have replaced ng-if to ng-show