javascript - 如何进一步抽象具有太多重复逻辑的指令

Question

我正在开发一个代码库，其中多个指令使用本质上重复的逻辑，只有一个通过范围更改传递的对象。例如:

return {
        restrict: 'A',
        scope:{
            someObject:"="
        },

link: function( scope, element, attrs ) {

scope.getSomeObject = function(){
...
    return scope.someObject.$$getSomeObject;
...
}
scope.saveSomeObject = function(){
...
    scope.someObject.$$saveSomeObject();
...
}
scope.removeSomeObject = function(){
...
    scope.someObject.$$removeSomeObject();
...
}

}

每个函数的逻辑都比较复杂，但本质上是我所展示的。一般来说，功能几乎完全相同，尽管偶尔会出现特殊情况。在我看来，指令本质上是为了解决每次都必须编写此代码的问题而创建的，并且当发现错误时，必须在各处进行修复。这些指令还在各自的 templateUrl 中复制了大部分(但不是全部)逻辑。编写一次并针对各种对象/案例反复使用的最明智的方法是什么？

Answer 1

这看起来像是使用“required”指令的完美用例。 查看 'require' 的文档指令定义对象的属性。

例如，您可以定义一个名为 someObject 的指令，并在自定义指令中要求它。

<my-directive some-object="somethingOnParentScope"></my-directive>

在你的myDirective定义中你会做类似的事情

return {
    restrict: 'A',
    require: 'someObject',


link: function( scope, element, attrs, someObjectCtrl ) {
  // if you need to make someObjectCtrl functionality available through templates, 
  // you will still need to add it to the scope
  scope.someFunction = someObjectCtrl.someFunction;
}