Angular 三种父子跨作用域方法

AngularJS自带指令 ng-include、ng-view、ng-switch、ng-repeat 以及人为添加的子controller，都是和directive实现方法一样，内部使用scope:true方式，子作用域继承了父级且构建了一个独立的子作用域，所有双向绑定实现不了，只能单独实现子级作用域继承父级的属性。

采用$scope.vm.key

AngularJS的继承是通过javascript的原型继承方式实现的，进行原型继承即意味着父作用域在子作用域的原型链上。因为原型链的检索只会在属性检索的时候触发，不会在改变属性值的时候触发。所以我们需要把原始类型转换成对象，把值绑定在对象的属性上。

例如:

var child={};
var parents={life:{name:'hello'}};
child.__proto__=parents;
child.life.name='ok';
console.log(parents.life.name)//ok

子继承父时,如果继承了一个对象,则对子的对象的修改也会影响到父,即完成了一次双向绑定
同理,

 
 
 


 

 
父级作用域
 {{vm.private1}}
 {{vm.private2}}
 
 

 
自己作用域
 

 

 

采用controller as

controller as其实相当于controller的示例对象，原理还是把原始类型转换成对象类型。

 
 
 


 

 
父级作用域
 {{vm.private1}}
 {{vm.private2}}
 
 

 
自己作用域
 

 

 

使用$parent.name调用内部方法来实现。

AngularJS的作用域还存在如下内部定义的关系：
scope.$parent指向scope的父作用域；
scope.$$childHead指向scope的第一个子作用域；
scope.$$childTail指向scope的最后一个子作用域；
scope.$$nextSibling指向scope的下一个相邻作用域；
scope.$$prevSibling指向scope的上一个相邻作用域；
通过在子级作用域中使用scope.$parent.name，来获取对父级作用域的双向绑定。

 
 
 


 

 
父级作用域
 {{private1}}
 {{private2}}
 
 

 
自己作用域