angular的指令的子作用域继承问题

例子1：

由于原型继承的关系，value为基本类型数据，修改父级对象中的value毫无疑问会影响子集对象；但是修改子级对父级不会有影响。

<div data-ng-controller="parentController">
{{value}}
<button ng-click="parentAction()">按钮</button>
<div data-ng-controller="childController">
{{value}}
<button ng-click="childAction()">按钮</button>
</div>
</div>
<script>
angular.module("myTest",[])
.controller("parentController",function($scope){
$scope.value="hello1";
$scope.parentAction=function(){
$scope.value="helloparent";
};
})
.controller("childController",function($scope){
//$scope.value="hello2";
$scope.childAction=function(){
$scope.value="hellochild";
};
})
</script>

以上代码的效果：



我们可以很明显地看到单击子级按钮，父级中的内容并没有发生变化。其根本原因，与我前面在js继承详解中写的一样。由于上面代码中的vallue是以基本类型定义的，而基本类型的复制只是简单的复制，并不是引用同一块内存。

例子2：

由于原型继承的关系，value为引用类型数据，修改子级对象中的value会影响父集对象

<div data-ng-controller="parentController">
{{someModel.value}}
<button ng-click="parentAction()">按钮</button>
<div data-ng-controller="childController">
{{someModel.value}}
<button ng-click="childAction()">按钮</button>
</div>
</div>
<script>
angular.module("myTest",[])
.controller("parentController",function($scope){
$scope.someModel = {
value: "hello1"
};
$scope.parentAction=function(){
$scope.someModel.value="helloparent";
};
})
.controller("childController",function($scope){
/*$scope.someModel = {
value: "hello2"
};*/
$scope.childAction=function(){
$scope.someModel.value="hellochild";
};
})
</script>

代码效果：



在此例中，子级可以改变父级中的变量。根本原因是：value的类型是字符串。在Javascript中，字符串属于引用类型的变量，而引用类型的复制是指针的复制，也就是parentAction中的value 和 childAction中的value指向的是同一块内存。那毫无疑问，我们修改其中一个必然会影响另外一个。

具体可以参考前面的js继承详解中的内容~