AngularJS中，当需要自定义Directive时，通常返回一个对象，就像如下的写法：

 

angular.module('modulename')    .directive('myDirective', function(){        return {            restrict: 'EA', //E表示element, A表示attribute,C表示class，M表示commnent,即注释            scope:{                title: '@' //@读属性值，=双向绑定，&用户函数            }            template: '
     
      {
   {myVal}}
     
',            templateUrl: 'app/sample.html',            controller: 'myController',            link:function($scope, element, attrs){}//DOM操作        };    })

 

也可以直接返回函数。实际上返回的是link对应的函数。

 

var app=angular.module('superhero',[]);app.directive("enter", function(){   return function(scope, element){       element.bind("mouseenter", function(){           console.log('I am inside of you');       })   }});app.directive("leave", function(){    return function(scope, element){        element.bind("mouseleave", function(){            console.log('i am leaving on a jet plane');        })    }})

 

以上，实际上return没有返回对象，而是返回了一个函数。

在页面中按如下调用：

<div enter leave>I am content</div>

 

另外，link函数还有一个attrs形参用来描述所有的属性，通过"attrs.属性名"来获取属性值。

 

app.directive("enter", function(){   return function(scope, element, attrs){       element.bind("mouseenter", function(){           element.addClass(attrs.enter);       })   }});app.directive("leave", function(){    return function(scope, element,attrs){        element.bind("mouseleave", function(){            element.removeClass(attrs.enter);        })    }})

 

在页面中按如下调用：

<div enter="panel" leave>I am content</div>