angularjs - AngularJS：从 compile() 和 link() 中重构辅助函数

Question

我的程序的一些指令需要有相当复杂的 DOM 操作以及编译和链接函数中的一些更多操作。如果我不使用指令，我会将该代码拆分为函数并将它们放在 compile fn 之外。

目前我有：

directive('myDir',...):
compile: function (element, attrs) {
   var a1,a2;
   a1 = action1() {...};
   a2 = action2() {...};

   a1(); a2();
   return { link function }
}

相反，我宁愿拥有：

directive('myDir',...):
compile: function (element, attrs) {
   a1(); a2(); // a1 and a2 declared somewhere else
   return { link function }
}

a1 和 a2 可以在指令中的其他位置声明以保持组件可重用，但同时具有可读代码。这些函数的定义当前在此编译函数中（不跨指令共享）。它只需要在那里，它可能会很长。

组织这个的一个漂亮的方式是什么？

我想过将指令包装在一个函数中：

(function () {
   var a1 = function(params) {};
   myapp.directive(...compile and link functions, as usual);
})();

Answer 1

像这样的东西？

myapp.directive('myDir', function() {
  var a1 = function(params) {
  };
  var a2 = function(params) {
  };
  return {
    link: ...,
    compile:...
  };
});

Answer 2

您可以创建一个服务来处理这些函数的行为。

yourApp.directive('yourDirective', ['SomeService', ..., function(SomeService, ...) {
  return {
    compile: function(...) {
      SomeService.action1(...);
      SomeService.action2(...);
      ...
    },
    link: ...
  }
}]);