title: Angular: Automatically update a scope reference to an object defined in a service?
body: <p>I have an angular app <code>myApp</code>with a service <code>myService</code>, holding an object <code>data</code>that is used by two Controllers, <code>parentCtrl</code> and <code>childCtrl</code> the latter inheriting from the former: <a href="https://jsfiddle.net/OleWahn/7ehLva10/2/" rel="nofollow">https://jsfiddle.net/OleWahn/7ehLva10/2/</a></p>
  
  <p>I reference <code>data</code> within <code>parentCtrl</code> by <code>$scope.data = myService.getData()</code> which also makes it accessible from <code>childCtrl</code>.</p>
  
  <p>I define <code>data</code> in the closure of <code>myService</code>, hence <code>$scope.data</code> is just a reference to <code>data</code>.</p>
  
  <p>Thus, I can alter <code>data</code>'s properties within the child controller and everyone, <code>myService</code>, <code>parentCrl</code> and <code>childCtrl</code> will be aware of these changes. So far, so good.</p>
  
  <p>My problem here is the following: If I want to overwrite the entire <code>data</code> object I invoke <code>myService</code>s method <code>setData</code> within <code>childCtrl</code>.</p>
  
  <p>Again, I'd like everyone to be notified that <code>data</code> has changed. 
  <code>$scope.data</code> however still points to the initially defined object and will not be notified by <code>myService</code> that <code>data</code> has changed, which will stand as my final question: </p>
  
  <p><strong>Is there a way to automatically update a scope reference to an object defined in a service?</strong></p>