javascript - 为什么我的装饰指令没有覆盖 AngularJS 中的原始方法？

Question

尝试按照 Angular Decorator 指南 (https://docs.angularjs.org/guide/decorators) 中的模板，我尝试创建一个指令并对其进行装饰。

该指令应该显示当前日期/时间。我添加了一个(无用的)装饰器来修改 link 函数，因此该指令显示字符串“today”而不是日期/时间。

出于某种原因，我覆盖的 link 函数似乎没有被调用。原来的被调用。这是为什么？

代码位于 http://plnkr.co/edit/uvtBiN5vNSjk5I89t99C?p=preview (及以下):

angular.module('app', []);

angular.module('app').directive('myElement',  function(){
  return {
    template: 'Today is {{ date }}',
    link: function(scope, element, attrs){
      console.log('original link called')
      scope.date = new Date();
    }
  }
})

angular.module('app').decorator('myElementDirective', function($delegate){

  $delegate[0].link = function(scope){
    console.log('calling delegate link')
    scope.date = "today"
  }
  return $delegate;
})

Answer 1

替换链接函数时，编译函数也需要替换。

angular.module('app').decorator('myElementDirective', function($delegate){

  $delegate[0].link = function(scope){
    console.log('calling delegate link')
    scope.date = "today"
  }
  //------------------------------------
  //REPLACE compile function
  $delegate[0].compile = function() {
    return $delegate[0].link;
  };
  //------------------------------------
  return $delegate;
})

当指令定义对象 (DDO) 省略编译函数时，$compileProvider.directive()注册方法添加一个返回对链接函数的引用的方法。需要更新编译函数以返回对新链接函数的引用。

$compile service忽略 DDO 的 link 属性。它仅使用 compile 属性。