Updating root scope variable with resource value

Question

In my main layout I have a heading, like:

<h1>{{ heading }}</h1>

I can set that to various static values from my controllers using:

$rootScope.heading = 'My Heading';

But if I try to create a dynamic heading from a resource, its blank:

app.controller('ShowAccountController', function($scope, $rootScope, $state, $stateParams, Account) {
  $scope.account = Account.get({ id: $stateParams.id });
  $rootScope.heading = $scope.account.name;
});

The account variable is definitely set there (checked via console) so I'm a bit stumped as to why the heading doesn't have a value?

Chrome's console intelligently updates the logged display value after the async call completes (apparently it passes a reference to the console) even though at the time of the log it is actually undefined because the async call hasn't completed yet. — Dan
– Dan, Commented Jun 19, 2013 at 3:33
@sh0ber How confusing! I'm sure that'll save me (and anyone reading this) some headache in the future. Thanks for the tip. — matthewrk
– matthewrk, Commented Jun 19, 2013 at 8:54

Stewie · Accepted Answer · 2013-06-19 04:50:55Z

1

As @sh0ber pointed out you are being confused be the way Chrome console works. Anyway, to set the heading variable you should use callback:

app.controller('ShowAccountController', function($scope, $rootScope, $state, $stateParams, Account) {
  $scope.account = Account.get({ id: $stateParams.id }, function(account){
    $rootScope.heading = account.name;
  });
});

answered Jun 19, 2013 at 4:50

Stewie

60.4k20 gold badges148 silver badges113 bronze badges

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

Collectives™ on Stack Overflow

Updating root scope variable with resource value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related