Question

我想做什么：

我正在尝试在可以从$rootScope调用的指令中创建一个函数。

问题：

似乎只处理DOM中具有此指令的最后一项。我猜测每次执行此指令时，rootScope.myFunction会被覆盖。

问题：

如何在$rootScope中创建一个函数，当调用它时，为每个指令而不是最后一个指令运行内部函数？

相关代码：

(function() {
  angular.module('home')
    .directive('closeBar', closeBar);

  closeBar.$inject = ['$rootScope', '$window'];
  function closeBar(rootScope, window) {
    return {
      scope: true,
      restrict: 'A',
      link: function(scope, element, attrs) {

        var myFunction = function() {
          // do stuff
        };

        myFunction();

        rootScope.myFunction = function() {
          myFunction();
        };
      }
    };
  }
})();

然后在另一个脚本中，我想打电话：

rootScope.myFunction();

请注意，我不允许从我正在处理的项目中分享实际代码，因此这是一个与特定用例无关的更一般的问题。

Answer 1

一个简单的解决方案是在rootScope中创建一个特殊函数，它接受函数作为参数，然后将其推送到数组中，稍后您将能够调用该函数调用所有已注册的函数。

 angular.module('myApp').run(['$rootScope', function($root) {
      var functionsToCall = [];
      $root.registerDirectiveFunction = function(fn, context) {
          context = context || window;
          functionsToCall.push({fn: fn, context: context});
      }
      $root.myFunction = function(args) {
          functionsToCall.forEach(function(fnObj) {
              fnObj.fn.apply(fnObj.context,args);
          });
      }
 }

在你的指令中：

 link: function($scope, $el, $attr) {
      function myFunct() {
      }
      $scope.$root.registerDirectiveFunction(myFunct, $scope);
      //call it if you want
      $scope.$root.myFunction();
 }

这应该涵盖您的方案。

从$ rootScope - AngularJS中的指令调用函数

1 个答案: