title: Angular scope binding
body: <p>I'm following a book, and using this version of Angular: <a href="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js[1]" rel="nofollow">https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js[1]</a></p>
  
  <p>This is my template:</p>
  
  <pre><code>&lt;div ng-controller="ParentController"&gt;
      &lt;div ng-controller="ChildController"&gt;
          &lt;a ng-click="sayHello()"&gt;Say hello&lt;/a&gt;
      &lt;/div&gt;
      {{ person }}
  &lt;/div&gt;
  </code></pre>
  
  <p>This is my controller code:</p>
  
  <pre><code>app.controller('ParentController', function ($scope) {
      $scope.person = { greeted: false };
  
  });
  
  app.controller('ChildController', function ($scope) {
      $scope.sayHello = function () {
          $scope.person = { name: "Ari Lerner", greeted: true };
      }
  });
  </code></pre>
  
  <p>I noticed my code doesn't doesn't update the template as expected unless I change my sayHello method to this:</p>
  
  <pre><code>$scope.sayHello = function () {
      $scope.person.name = "Ari Lerner";
      $scope.person.greeted = true;
  };
  </code></pre>
  
  <p>Any insight as to why this might be? I was under the assumption that updating person would be reflected in the DOM.</p>
  
  <hr>
  
  <p>Using 1.4.2 yields the same result.</p>
  
  <p>Thinking that maybe the properties are somehow indexed differently, I tried the following:</p>
  
  <pre><code>$scope.person.name = { greeted: true, name: "Ari Lerner" };
  </code></pre>
  
  <p>(switched greeted and name)</p>
  
  <p>Wild speculation: It seems to me that something in Angular is holding on to the original object that was assigned to $scope.person and setting $scope.person to a new object "loses" the data binding.  Is this true?</p>