深刻理解 AngularJS 的 Scope

1、遇到的問題

問題發生在使用 AngularJS 嵌套 Controller 的時候。由於每一個 Controller 都有它對應的 Scope（至關於做用域、控制範圍），因此 Controller 的嵌套，也就意味着 Scope 的嵌套。這個時候若是兩個 Scope 內都有同名的 Model 會發生什麼呢？從子 Scope 怎樣更新父 Scope 裏的 Model 呢？

<div ng-app="myApp">
    <div ng-controller="ParentController">
        {{parentPrimitive}}
        <br />
        {{parentObj.parentProperty}}
        <div ng-controller="ChildController">

        </div>
    </div>
</div>

var app = angular.module('myApp',[]);
app.controller('ParentController',function($scope){
    $scope.parentPrimitive = "some primitive"
    $scope.parentObj = {};
    $scope.parentObj.parentProperty = "some value";
});
app.controller('ChildController',function($scope){
    $scope.parentPrimitive = "this will NOT modify the parent"
    $scope.parentObj.parentProperty = "this WILL modify the parent";
});

結果：輸出：

some primitive 
this WILL modify the parent

還有另外一種方法：

一、在子做用域中使用 $parent.xxx，這樣能夠直接修改父做用域的屬性。

eg:

$scope.$parent.parentObj = "this WILL modify the parent";