指令裝飾器

有時你可能需要指令中的其他功能。你可以修改指令的行為方式,而不是重寫(複製)指令。

裝飾器將在$ inject 階段執行。

為此,請為你的模組提供 .config。該指令名為 myDirective,因此你必須配置 myDirectiveDirective。 (這是一個有角度的約定[讀取提供者])。

此示例將更改指令的 templateUrl:

angular.module('myApp').config(function($provide){
        $provide.decorator('myDirectiveDirective', function($delegate){
             var directive = $delegate[0]; // this is the actual delegated, your directive
             directive.templateUrl = 'newTemplate.html'; // you change the directive template
        return $delegate;
    })
});

此示例在單擊時向指令元素新增 onClick 事件,這在編譯階段發生。

angular.module('myApp').config(function ($provide) {
        $provide.decorator('myDirectiveTwoDirective', function ($delegate) {
            var directive = $delegate[0];
            var link = directive.link; // this is directive link phase
            directive.compile = function () { // change the compile of that directive
                return function (scope, element, attrs) {
                    link.apply(this, arguments); // apply this at the link phase
                    element.on('click', function(){ // when add an onclick that log hello when the directive is clicked.
                            console.log('hello!');
                    }); 
                };
            };
            return $delegate;
        });

    });

類似的方法可以用於提供者和服務。