Scope独立，保持指令的独立性，不相互干扰 ，只需要加一个空Scope的对象

---

 

Scope的绑定策略

@ 把当前属性作为字符串传递，你还可以绑定来自外层Scope的值，在属性值中插入{

{}}即可

= 与父scope中的属性进行双向绑定

& 传递一个来自父scope的函数，稍后调用

---

 

HTML  @绑定（展示控制里的内容）

 

JS

var myModule = angular.module("MyModule", []);myModule.controller('MyCtrl', ['$scope', function($scope){    $scope.ctrlFlavor="百威";}])myModule.directive("drink", function() {    return {        restrict:'AE',        scope:{            flavor:'@'        },        template:"
     
      {
    {flavor}}
     
"        // ,        // link:function(scope,element,attrs){
             //     scope.flavor=attrs.flavor;        // }    }});

 

 

HTML =绑定（双向绑定）

 

1  2  3      4         
      5         
      6      7      8         
     
       9             Ctrl:10             
      
11             
      12             
      
13             Directive:14             
      
15             
      16         
     
17     18     19     20 

 

JS

var myModule = angular.module("MyModule", []);myModule.controller('MyCtrl', ['$scope', function($scope){    $scope.ctrlFlavor="百威";}])myModule.directive("drink", function() {    return {        restrict:'AE',        scope:{            flavor:'='        },        template:''    }});

 

HTML &绑定

 

 

JS

var myModule = angular.module("MyModule", []);myModule.controller('MyCtrl', ['$scope', function($scope){    $scope.sayHello=function(name){        alert("Hello "+name);    }}])myModule.directive("greeting", function() {    return {        restrict:'AE',        scope:{            greet:'&'        },        template:'
'+                 'Greeting
'    }});