先从定义一个简单的指令开始。 定义一个指令本质上是在HTML中通过元素、属性、类或注释来添加功能。
AngularJS的内置指令都是以ng开头，如果想自定义指令，建议自定义一个前缀代表自己的命名空间。
这里我们先使用my作为前缀:
控制器
directive('my-directive',[function(){
return{
template : "<h2>我是自定义指令内的模板</h2>",
// 默认只支持属性和标签
restrict : "ECMA",
// 如果是注释的话一定要用replace
replace : true,
}
}])
视图
<h1>标签形式</h1>
<my-directive></my-directive>
<hr>
<h1>属性形式</h1>
<div my-directive></div>
<hr>
<h1>class形式</h1>
<div class="my-directive"></div>
<hr>
<h1>注释形式</h1>
<!-- directive:my-directive -->
效果展示
Paste_Image.png
下面我们分析一下上面的代码：
directive()
<code>directive()</code>接受两个参数
- my-directive：指的是指令的名字name
- factory_function：函数，指令的行为
应用启动时，以name作为该应用的标识注册factory_function返回的对象。
在factory_function中，我们可以设置一些选项来改变指令的行为。
template
返回一段字符串作为模板
restrict
该属性用于定义指令以什么形式被使用，这是一个可选参数，元素（E）、属性（A）、类（C）、注释（M），当然也可以写EAMC，代表全部形式可用。
replace(替换元素)
默认为 false，就是将模版的内容追加到元素中，如果设置为 true，那么模版的内容将会替换元素的内容
那么我们以以上代码为例看一下吧
当replace：false //(默认)
Paste_Image.png
模板插入到我们自定义的指令内部
当replace：true
Paste_Image.png
模板替换了我们自定义的指令内部
最后加一个templateUrl属性
这个就和上面的template很像了，只不过这次是通过URL请求一个模板
templateUrl : "./footer.html"
这里需要注意：URL模板只能在服务器上才能实现，而且footer.html内只能有一个最外层标签，注释及脚本的引用都只能在这个标签内使用，否则会报错。
