title: angularjs - $locationChangeStart - data set on rootScope isn't available in my controller
body: <p>I have an app where certain routes are restricted if the user is not logged in. This is my run function:</p>
  
  <pre><code>function run($rootScope, $location, UserService) {
      var homeRoute = '/';
  
      $rootScope.$on('$locationChangeStart', function(event, next, current) {
          var isPageRestricted = $.inArray($location.path(), [homeRoute, '']) === -1;
  
          if (!isPageRestricted) {
              return;
          }
  
          UserService
              .verifyUserToken()
              .then(function(data) {
                  var userData;
  
                  if (data.valid) {
                      $rootScope.userData = $rootScope.userData || UserService.getUserTokenAndData();
                  } else {
                      $rootScope.userData = null;
                      $location.path(homeRoute);
                  }
              })
              .catch(function() {
                  $rootScope.userData = null;
                  $location.path(homeRoute);
              });
      });
  }
  </code></pre>
  
  <p>As you can see, when a user enters a restricted route, I send a request to the server to verify its token. If the token is valid, I store the user's data to <code>$rootScope.userData</code>. Then, in one of my restricted views I get that <code>$rootScope.userData</code> is <code>null</code> in the beginning, and non-null after page is refreshed. I presume it is because of the asynchronous nature of the operation. What is the best way to make it work?</p>
  
  <p>Thanks.</p>