常见三种:
1.false-----完全继承父级,子父同步
2.true------继承父级,同时创建自己的作用域,父级改变,自己改变,但自己改变父级不变
3.{}--------创建自己的作用域,和父级完全隔离,与父级毫无关系
♣隔离条件下着重介绍的三个子父之间传值关系
1.@父传子,子不能传父--------》字符串,有{{}}
2.=父子相传,作用域相通------》变量,无{{}}
3.&子传父,子变化时,父有函数对应执行,父级监听子级-------》directive里绑定的是函数,函数的返回值绑定父级中的值或者函数
以上@,=这两种方式要注意第一种是字符串,而第二种是变量,从双花括号{{}}的使用可以区别开来。&用于绑定父级的值或者函数进而通过父级的含函数监听子级的变化
事例
<div ng-app="myapp" ng-controller="mycontrol"> <div>{{name}}<input type="text" ng-model="name"/></div> <myelement myname="{{name}}"></myelement></br> <myelem twoname="name"></myelem></br> <myele threename="name"></myele></br> <myel fourname="box()"></myel> </div> <script type="text/javascript"> var app = angular.module('myapp', []); app.controller('mycontrol', function($scope) { $scope.name="hello world!"; $scope.box=function(){ alert("子级调用父级函数") } }).directive("myelement",function(){ return{ restrict:"EA", template:"<input type='text' ng-model='myname'>", scope:{ myname:"@" } } }).directive("myelem",function(){ return{ restrict:"EA", template:"<input type='text' ng-model='twoname'/>", scope:{ twoname:"=" } } }).directive("myele",function(){ return{ restrict:"EA", template:"<div>{{threename()}}</div>",
//template:"<input type='text' ng-model='threename()'/>",这样不能成功,如果是这样就类似于@ scope:{ threename:"&" } } }).directive("myel",function(){ //子级调用父级函数 return{ restrict:"EA", template:"<div ng-click='fourname()'>点击</div>", scope:{ fourname:"&" } } }) </script>