Angular(二)——指令

       指令是Angular的一个特殊标志，也是有别于其他框架的一个重要特征，Angular之所以功能强大，在很大程度上得益于它拥有大量内置的指令，也能通过语法自定义指令。从字面意义来说，“指令”是一种执行的信号，一旦发布了这个指令，就要执行某项动作。Angular中的指令是一个在特定DOM元素上执行的函数。

Angular

一、定义指令

在Angular中，定义一个新指令的方法很简单，只需要调用directive方法即可，该方法可以接收两个参数，具体的调用格式如下：
var app = angular.module("myapp", []);
app.directive(name, fn) ;
示例代码如下：

执行结果如下：

执行结果

二、指令对象的基础属性

       replace属性值是布尔类型的，当该属性值为true时，表示将模板中的内容替换为指令为标记；当该属性值为false时，表示不替换指令标记，而是将内容插入到指令标记中，此时，无论指令标记中是否存在内容，都将被清空，该属性的默认值为false。
       templateUrl的属性值是一个URL地址，该地址将指向一个模板页面，该属性常用于处理复杂模板内容，与template属性不能同时使用，只能取其中之一。
示例代码如下：

三、Angular指令对象的重要属性

1.指令对象中的transclude属性

在定义指令对象时，可以不添加transclude属性，如果添加该属性，那么它的属性值是布尔类型的，默认值为false，表示不开启属性，如果设置为true时，则开启了该属性；当开启了属性后，就可以在模板中通过ng-transclude方式替换指令元素中的地内容。
代码示例如下：

    
        
        
    
    
        
            
这里是指令内部的内容。
        

        
     

2.指令对象中的link属性

“link”属性的值是一个函数，在该函数中可以操控DOM元素对象，包括绑定元素的各类事件，定义事件触发时执行的内容，函数定义的代码如下：
link:function(scope,element,attrs){
...
}
其中，scope参数表示指令所在的作用域，它的功能和页面中控制器注入的作用域是相同的，element参数表示指令中的元素，attrs表示指令元素的属性集合。
示例代码如下：

    
        
        
        
        
        

    

    
     

        
        
{{content}}
     
   
     
     

3.指令对象的scope属性

（1）scope属性是布尔值

scope属性自定义指令时，默认值就是布尔类型的，初始值为false。在这种情况下，指令中的作用域就是指令元素所在的作用域，两者是相同的。如果scope属性值为true,则表示子作用域（指令中的作用域成为子作用域，把指令元素所在的作用域称为父作用域）是独立创建的，当它的内容发生变化时，并不会修改父作用域中的内容。示例代码如下：

    
        
        
        
        
        
    

    
     

      
      固定
     

     
    
    

（2）scope属性是对象

scope属性值还可以设置成一个JSON对象，如果是对象，那么，父作用域与自作用域是完全独立的，不存在任何联系。当指令中的scope属性值是JSON对象时，如果子作用域需要添加属性，必须先添加指令中的link函数，然后，通过函数中的scope对象进行添加；如果在子作用域中，要绑定或调用父作用域中的属性和方法，则需要在scope属性对应的的JSON对象值中添加绑定策略。