angularjs - Angular 可重用函数

Question

我有几个指令需要在完成它们的操作后调用相同的函数。这个函数需要访问主控制器作用域，还要修改 DOM。这个函数应该如何以及在哪里声明？

Answer 1

您应该使用服务，服务可以访问$rootScope，尽管将 DOM 修改保持在指令级别会更好，在某些情况下您可以这样做。

angular.module("myModule", [])
.factory("MyService", function ($rootScope) {
    return {
        myFunction: function () { // do stuff here }
    }
})
.directive("MyDirective", function (MyService) {
    return {
        link: function (scope, iElement, iAttrs) {
            // try do keep dom modification here, you have access to MyService,
            // let it do the algorithm and try to keep dom modification here.
            // PS: you can also inject $rootScope to directives.
        };
    };
});

Answer 2

如果此函数需要访问 Controller 的范围，我将使用指令中可访问的范围并将其作为参数传递，如下所示：

var MyDirective = function() {
    var linkFn = function(scope, element, attrs) { 
        callAwesomeFn(scope);
    };

    return {
        link: linkFn
    }
};

现在，放在哪里？

• 如果这是实用程序功能，我会放入一些实用程序名称空间，例如MyFunctions.callAwesomeFn()
• 如果这是一个需要与 Angular 管理的其他对象交互的组件 - 使用依赖注入并将其注入指令