title: How to access/update $rootScope from outside Angular
body: <p>My application initializes an object graph in $rootScope, like this ...</p>
  
  <pre><code>var myApp = angular.module('myApp', []);
  
  myApp.run(function ($rootScope) {
      $rootScope.myObject = { value: 1 };
  });
  </code></pre>
  
  <p>... and then consumes data from that object graph (1-way binding only), like this ...</p>
  
  <pre><code>&lt;p&gt;The value is: {{myObject.value}}&lt;/p&gt;
  </code></pre>
  
  <p>This works fine, but if I subsequently (after page rendering has completed) try to update the $rootScope and replace the original object with a new one, it is ignored. I initially assumed that this was because AngularJS keeps a reference to the original object, even though I have replaced it.</p>
  
  <p>However, if I wrap the the consuming HTML in a controller, I am able to repeatedly update its scope in the intended manner and the modifications are correctly reflected in the page.</p>
  
  <pre><code>myApp.controller('MyController', function ($scope, $timeout) {
      $scope.myObject = { value: 3 };
  
      $timeout(function() {
          $scope.myObject = { value: 4 };
  
          $timeout(function () {
              $scope.myObject = { value: 5 };
          }, 1000);
      }, 1000);
  });
  </code></pre>
  
  <p>Is there any way to accomplish this via the $rootScope, or can it only be done inside a controller? Also, is there a more recommended pattern for implementing such operations? Specifically, I need a way to replace complete object graphs that are consumed by AngularJS from outside of AngularJS code.</p>
  
  <p>Thanks, in advance, for your suggestions,
  Tim</p>
  
  <p>Edit: As suggested in comments, I have tried executing the change inside $apply, but it doesn't help:</p>
  
  <pre><code>setTimeout(function() {
      var injector = angular.injector(["ng", "myApp"]);
      var rootScope = injector.get("$rootScope");
  
      rootScope.$apply(function () {
          rootScope.myObject = { value: 6 };
      });
  
      console.log("rootScope updated");
  }, 5000);
  </code></pre>