我在以前的文章里写过关于指令的作用域继承与格里，指令作用域继承与隔离，可以在<code>directive</code>中通过<code>scope={}</code>实现。controller可以实现继承和隔离，首先继承是依赖于<code>scope</code>树的，也就是说只要存在了<code>scope</code>就能实现继承，隔离也只是在特定条件下才形成的隔离（这种思路和指令的继承与隔离很相似，其实道理也一样）。对于<code>controller</code>与<code>directive</code>都存在基本类型与引用类型的区别。今天先说一个<code>controller</code>。
下面是继承效果:
继承
<!DOCTYPE html>
<html lang="en" ng-app="messageApp">
<head>
<meta charset="UTF-8">
<title></title>
<script src="lib/angular.min.js" type="text/javascript"></script>
</head>
<body ng-controller="parentController">
<h1>基本类型:{{value}}</h1>
<h1>引用类型:{{obj.value}}</h1>
<input type="button" ng-click="parentChange('parent')" value="parent"/>
<div ng-controller="childController">
<h1>基本类型:{{value}}</h1>
<h1>引用类型:{{obj.value}}</h1>
<input type="button" ng-click="childChange('child')" value="child"/>
</div>
</body>
<script>
var app=angular.module("messageApp",[])
.controller("parentController",["$scope",function($scope){
var obj=$scope.obj={};
$scope.value="default";
obj.value="default";
$scope.parentChange= function (data) {
$scope.value=data;
var obj=$scope.obj={};
obj.value=data;
}
}])
.controller("childController",["$scope",function($scope){
$scope.childChange= function (data) {
$scope.value=data;
obj.value=data;
}
}])
</script>
</html>
这里可以看到，基本类型和引用类型在初始化启动的时候，会默认继承父作用域，不管是基本类型和引用类型都会继承。但是点击child和parent两个按钮的时候，引用类型的数据都会与父作用域一致，只有点击child的时候，子作用域的基本类型才会被重新设置。原因就是，引用类型的原型都指向了一个对象obj，每次都会找到这里。
下面是隔离效果:
2.gif
<!DOCTYPE html>
<html lang="en" ng-app="messageApp">
<head>
<meta charset="UTF-8">
<title></title>
<script src="lib/angular.min.js" type="text/javascript"></script>
</head>
<body ng-controller="parentController">
<h1>基本类型:{{value}}</h1>
<h1>引用类型:{{obj.value}}</h1>
<input type="button" ng-click="parentChange('parent')" value="parent"/>
<div ng-controller="childController">
<h1>基本类型:{{value}}</h1>
<h1>引用类型:{{obj.value}}</h1>
<input type="button" ng-click="childChange('child')" value="child"/>
</div>
</body>
<script>
var app=angular.module("messageApp",[])
.controller("parentController",["$scope",function($scope){
var obj=$scope.obj={};
$scope.value="default";
obj.value="default";
$scope.parentChange= function (data) {
$scope.value=data;
var obj=$scope.obj={};
obj.value=data;
}
}])
.controller("childController",["$scope",function($scope){
$scope.childChange= function (data) {
var obj=$scope.obj={};
$scope.value=data;
obj.value=data;
}
}])
</script>
</html>
两个的区别就是隔离的时候，子作用域通过<code>var obj=$scope.obj={};</code>又形成了一个引用对象，这样就不会同父作用域使用同一个引用对象。
