title: AngularJS $scope Updated, Not The View
body: <p>I've looked at numerous posts but haven't found one that quite matches up with what I'm looking for yet. I split into multiple controllers to clearly separate functionality into multiple areas. There is a centralized service that contains all data that is passed between the individual controllers and displayed on the screen in different areas. I'm running into an issue with a controller that is further down the line that is grabbing the same data as the others, but the UI isn't updated when the data in the service is manipulated. In each controller I set a scope variable to the object in the service..</p>
  
  <pre><code>$scope.package = SampleService.getPackage();
  </code></pre>
  
  <p>I then use an ng-repeat to loop over the package, which, contains an array, and could contain a nested array of data to be shown. During the process, data is processed and assigned to these items (within the service, not the controller). If I put the $scope.package variable in a loop, I can see that the variable is getting updated from the service (watching it in the console) but the changes aren't reflected on the screen. In particular, I'm setting several values true/false and depending on their value, several icons would be shown on the screen. The icons never show (hasn't detected the scope variable hasn't changed) until I click something on the screen (assuming this triggers a digest loop). The icons will then show up. However, they change several times based on the status of the task. I have to continue clicking to make the icons change.</p>
  
  <p>Is there something I'm missing? Changes to the structure work perfectly in another area of the page. It's this one area that I can't get to work right. The only difference is that I'm toggling true/false instead of manipulating other areas of the object. Could using angular.copy to set the true/false values help?</p>
  
  <p>I'm kind of at a loss with what to do from here..</p>
  
  <p>Suggestions?</p>