0

I'm having trouble trying to reflect my changes in $rootScope. As I understand (please note that I'm very new to angular), $rootScope is visible across controllers. What I'm trying to do is to update a value in $rootScope and trying to read that value in my html page.

The problem is even though the changes are applied to $rootScope its not reflecting in my view. Following is the code

I have a div which I want to show/hide depending on the value

#view
<div ng-hide="{{logged}}">
  // this should visible only if the logged is true
</div>  



#controller1 I set the rootscope to false
$rootScope.logged = false; // this makes the view hidden


#controller2 I set the rootScope to true
$rootScope.logged = true; 
$rootScope.$apply();

But making the $rootScope.logged = true doesn't make the view visible. My questions are

1 - What I might be going wrong?

2 - What is the most Angular way of doing such a thing?

halfer
  • 19,824
  • 17
  • 99
  • 186
sameera207
  • 16,547
  • 19
  • 87
  • 152

1 Answers1

2

No need to use {{ in your html template.

#view
<div ng-hide="logged">
  // this should visible only if the logged is true
</div>

This is enough.

Saidh
  • 1,131
  • 1
  • 12
  • 21
  • thanks it works, and I could removed the `$rootScope.$apply()` as well, all good now :) – sameera207 Dec 03 '14 at 21:12
  • You only need to use $apply if you are updating out of the angular context (if my knowledge serves correct) e.g jquery, if you're in a scope object you shouldn't need to call apply – Lewis Dec 05 '17 at 22:03