AngularJS官方指南-指令篇。

本文档解释了你应该在什么时候创建自己的指令，并且演示了怎么创建自己的指令。

请注意

本文档面向已经有 AngularJS 基础的开发者。如果你刚开始接触 AngularJS，建议你先去阅读下新手教程。如果你想查看指令 API，你可以查看 $compile API docs。

什么是指令？

从深层次来说，指令作用于 DOM 元素（例如：属性、元素名、注释或者类名），告诉 AngularJS’s HTML compiler（$compile） 关联一系列行为到特定的 DOM 元素上（例如：通过事件监听），甚至可以转换 DOM 元素以及它的子元素。
AngularJS 提供了一系列内置指令，比如：ngBind，ngModel和 ngClass。就像你创建控制器或者服务一样，你可以创建自己的指令。当 AngularJS 启动你的应用时，HTML compiler 会转换匹配了指令的 DOM 元素。

编译 HTML 模板是什么意思？对于 AngularJS 来说，“编译”意味着关联指令到 HTML ，使 HTML 变得可交互。之所以使用“编译”这个词，是因为递归地关联指令的操作和编译源代码的过程非常相似。

匹配指令

在开始写自定义指令之前，我们需要弄清楚 AngularJS 的 HTML 编译器什么时候编译指令。
就像 HTML 标准术语元素选择器匹配元素一样，当指令是一个元素声明的一部分时，我们说一个元素匹配一个指令。

标准化

AngularJS 标准化定义了元素名和属性名的命名方式，以便判断什么时候一个元素匹配一个指令。一般使用大小写敏感的驼峰法来命名指令（例如：ng-model）。然而，HTML 是大小写不敏感的，所以在 HTML 中使用全部小写中间加上中划线的方式来表示指令（例如：ng-model）。

创建指令

首先让我们先说说注册指令 API。跟控制器类似，指令必须注册在模块上。使用 module.directive API 来注册指令，module.directive 使用第一个参数作为指令名，第二个参数是一个工厂方法。工厂方法应该返回一个对象来告诉 $compile 指令的各种表现配置。

当编译器第一次匹配指令时，工厂方法会被调用一次，并且只会被调用一次。你可以把你的初始化操作放在工厂方法里。底层使用 $injector.invoke 来调用工厂方法以便指令可以像控制器一样可注入。

指令模板可以使用 template 参数或者 templateUrl 参数。templateUrl 参数的值可以是一个方法，这个方法有两个参数：使用指令的元素、以及该元素的属性。所以，我们可以通过指定属性值的方式指令模板路径。

创建一个操作DOM的指令

创建操作 DOM 的指令，我们使用 link 配置。link 选项的方法会在模板克隆完成，指令逻辑将被关联的时候执行。方法签名：function link(scope, element, attrs, controller, transcludeFn) { ... }