AngularJs（五）指令

指令作为AngularJs的核心特性之一，也是AngularJs的一个难点。指令本质上就是AngularJs扩展具有自定义功能的HTML元素的途径。

一.内置指令

AngularJS提供了一系列内置指令。其中一些指令重载了原生的HTML元素，比如 <form> 和<a> 标签，当在HTML中使用标签时，并不一定能明确看出是否在使用指令。

例如， <form> 标签被从底层扩展了一系列高级功能，包括表单验证等，原生HTML表单并不会提供这些功能。

最后，某些内置指令并不会有对应的HTML标签，比如 ng-controller ，这个指令可以在标签的属性中使用，通常在包含很多子元素并且需要共享作用域时使用。

注意，所有以 ng 前缀开头作为命名空间的指令都是AngularJS提供的内置指令，因此不要把你自己开发的指令以这个前缀命名。

具体的指令用法可以参考AngularJS官方文档点击打开链接

二.自定义指令

AngularJS应用的模块中有很多方法可以使用，其中 directive() 这个方法是用来定义指令的：
angular.module('myApp', [])
.directive('myDirective', function ($timeout, UserDefinedService) {
<span style="white-space:pre"> </span>// 指令定义放在这里
});

angular.module('myApp', [])
.directive('myDirective', function() {
return {
restrict: String,
priority: Number,
terminal: Boolean,
template: String or Template Function:
function(tElement, tAttrs) (...},
templateUrl: String,
replace: Boolean or String,
scope: Boolean or Object,
transclude: Boolean,
controller: String or
function(scope, element, attrs, transclude, otherInjectables) { ... },
controllerAs: String,
require: String,
link: function(scope, iElement, iAttrs) { ... },
compile: // 返回一个对象或连接函数，如下所示：
function(tElement, tAttrs, transclude) {
return {
pre: function(scope, iElement, iAttrs, controller) { ... },
post: function(scope, iElement, iAttrs, controller) { ... }
}
// 或者
return function postLink(...) { ... }
}
};
});