Angular JS 中 指令详解

Posted 2020-10-26 pikzas

Angular JS的强大功能就在于其可以自定义很多指令，现在就指令做一下详细的剖析。

一个Angular js 指令（directive）的生命周期 开始于$compile方法 结束于$link方法。

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(...) { ... }

　　　　　　}
　　　};
});