将基本指令功能扩展到其他指令

Question

我只是想检查angularjs中是否可以使用此功能。

例如：我有带有一些常见函数的基本指令，但在我的整个应用程序中，所有指令都需要实现这些函数，因此会出现更多的代码重复，我希望能实现与Java中的extends（继承）相同的功能。

有可能在angularjs中实现这一功能吗。？

根据我的要求，我不能通过将此代码移动到服务或工厂来归档此函数，因为这就像应用程序中的所有by指令一样，需要在链接上执行此操作，所以现在我的所有指令链接函数都使用重复代码来容纳相同的功能。

我期待着为我的所有指令扩展基本指令功能。

[注]我的应用程序中的大多数指令都具有独立的作用域。

Answer 1

答案主要在于JS领域，为可重用代码寻找模式是一个很好的挑战。Angular得到了extend、copy和merge，但仅此而已，模块和DI只是绕过ES5限制的方法。

以下是关于如何从指令定义对象创建mixin的提示。

app.directive('blockBase', function () {
    return {
        link: function (scope, element, attrs) {
            scope.title = 'block';
        }
    };
});
app.directive('brickBase', function () {
    return {
        restrict: 'E',
        scope: true,
        link: function (scope, element, attrs) {
            // ...
        }
    };
});
app.directive('block', function (blockBaseDirective, brickBaseDirective) {
    var blockDirective = angular.extend(brickBaseDirective[0], {
        name: 'brick',
        restrict: 'EA',
        scope: {
            title: '='
        }
    });
    blockDirective.compile = function (element, attrs) {
        // ...
        return {
            post: function (scope, element, attrs) {
                blockBaseDirective[0].link(scope, element, attrs);
                scope.title += ' offspring';
            }
        };
    };
    return blockDirective;
});

您应该自己决定这种方法是否比装饰器更好。

在控制器/指令定义之外使用命名函数是消除重复代码的常用方法，而不是优雅的方法。当然，您可以在具有自定义DDO属性的指令之间共享函数或类。然而，工厂仍然更适合这样做。