title: Angular view not updated
body: <p>If I modify $scope after a $timeout, my view doesn't get rendered properly.  I don't understand why.  It works if I don't do the $timeout first.</p>
  
  <p><a href="http://plnkr.co/edit/oGuPgt7VaYKgPFh00lDV?p=preview" rel="nofollow">http://plnkr.co/edit/oGuPgt7VaYKgPFh00lDV?p=preview</a></p>
  
  <pre><code>&lt;script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.min.js'&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"&gt;
  
  &lt;script&gt;
  
  angular.module('treeApp', [])
  
  .controller('TreeController', ['$scope', '$timeout', function($scope, $timeout) {
  
    // This works
    // $scope.nodes = {
    //   1:{node_id:1, text:'foo text', parent_id:null, child_ids:[2,3]},
    //   2:{node_id:2, text:'bar text', parent_id:1, child_ids:[]},
    //   3:{node_id:3, text:'abc text', parent_id:1, child_ids:[]}
    // }
    // $scope.top_ids = [1]
  
    // This doesn't work
    $timeout(function() {
      $scope.nodes = {
        1:{node_id:1, text:'foo text', parent_id:null, child_ids:[2,3]},
        2:{node_id:2, text:'bar text', parent_id:1, child_ids:[]},
        3:{node_id:3, text:'red text', parent_id:1, child_ids:[]}
      }
      $scope.top_ids = [1]
    }, 1000)
  }])
  
  &lt;/script&gt;
  
  
  &lt;div ng-app="treeApp"&gt;
  
    &lt;script type="text/ng-template" id="node.html"&gt;
      &lt;li node_id="{{node_id}}" ng-repeat="node_id in node_ids" ui-tree-node
          ng-init="node = nodes[node_id]"&gt;
        {{node.text}}
        &lt;ol ng-include="'node.html'" ng-init="node_ids = node.child_ids"&gt;&lt;/ol&gt;
      &lt;/li&gt;
    &lt;/script&gt;
  
    &lt;div ng-controller="TreeController"&gt;
      &lt;ol ng-include="'node.html'" ng-init="node_ids = top_ids"&gt;&lt;/ol&gt;
      &lt;pre&gt;{{top_ids | json}}&lt;/pre&gt;
      &lt;pre&gt;{{nodes | json}}&lt;/pre&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>