directive用来解决什么问题？
指令，可以简单理解为在DOM元素上运行的函数，指令可以扩展该DOM元素的功能。
我们可以封装公共指令，比如分页指令、自动补全指令等等。
1. 使Html更具语义化，不需要深入研究代码和逻辑即可知道页面的大致逻辑。
2. 抽象一个自定义组件，在其他地方进行重用。
myModule.directive('namespaceDirectiveName', function factory(injectables) {
var directiveDefinitionObj = {
restrict: "E", //ele, attr, class, m(comments), 或者任意组合。推荐用A，有比较好的跨浏览器兼容性。
priority: 1, //number, 设置模板中相对于其他元素指令的执行顺序，默认为0.优先级最低
template: "string", //内联模板，和url模板二选一。
templateUrl: "url", //url模板。可预先缓存模板来减少http请求，提高性能。
replace: true, //bool值，替换或者追加（默认）。
transclude: true, //默认false 是否保留自定义标签的原始内容，在模板中通过ng-transclude指令，替换/追加内容?
//是否需要将指令内部的元素（注意不是指令的模板）嵌入到模板。在ng-transclude位置。
//会导致在控制器中无法正常监听数据模型的变化
scope:true,
//bool or {}空对象, 是否创建新作用域。创建隔离作用域，表示新作用域与父作用域隔离，可正常执行不受外部工作环境影响
//意味指令有了一个自己的$scope对象。 这个对象只能在指令的方法或模板字符串使用。
controller:function controllerConstructor($scope, $element, $attrs, $transclude) {
//...为跨指令通信创建一个发布的API
},
require: "string", //字符串/数组。需要其他指令服务于这个指令来正确的发挥作用,并会作为link函数的第四个参数
//前缀：?当前指令无控制器，会将null作为link第四个参数。^在上游指令链中查找控制器。
// ?^ 组合两个前缀，可选择加载需要的指令并在父指令链中进行查找。不加前缀，又找不到控制器，就会抛出错误。
link:function postLink(scope, iElement, iAttrs) {
//...以编程的方式修改生成的DOM元素实例，添加事件监听，数据绑定。执行多次。从模板创建的视图实例获得元素和属性
},
compile:function compile(tElement, tAttrs, transclude) {
//仅在编译阶段执行一次，处理模板自身的转换。在编译阶段，作用域还不存在。
//为了提升效率，自定义标签的实例中需要修改的公共属性，在compile中处理
return {
pre: function preLink(scope, iElement, iAttrs, controller) {
//...
},
post:function postLink(scope, iElement, iAttrs, controller) {
//...
}
}
}
};
return directiveDefinitionObj;
});
IDE推荐webstorm, 因为它是一个继承了angularJS，有非常强大的代码补全功能。比如输入ngdc，
再回车或者tab键，获取以下这段代码，可以节省好多一个字一个字敲代码的时间，超赞有木有...
directive('', function factory() {
var directiveDefinitionObject = {
compile
:
function compile(tElement, tAttrs, transclude) {
return function (scope, element, attrs) {
}
}
}
;
return directiveDefinitionObject;
})
ngm: angular.module('', []);
ngrw:
$routeProvider.when('', {
templateUrl: '',
controller: ''
});
ngro: $routeProvider.otherwise({redirectTo: ''});
ngrwr:
$routeProvider.when('', {
templateUrl: '',
controller: '',
resolve: {}
});