AngularJS中的指令到指令通信？

Question

我已经知道你可以在一个指令中设置一个控制器,其他指令可以调用该控制器上的函数.这是我当前的指令:

app.directive("foobar", function() {
  return {
    restrict: "A",
    controller: function($scope) {
      $scope.trigger = function() {
        // do stuff
      };
    },
    link: function(scope, element) {
     // do more stuff
    }
  };
});

我知道我可以这样称呼它:

app.directive("bazqux", function() {
  return {
    restrict: "A",
    require: "foobar",
    link: function(scope, element, attrs, fooBarCtrl) {
        fooBarCtrl.trigger();
    }
  };
});

但是,我希望能够从任何指令调用触发器,而不仅仅是我自己的自定义指令,如下所示:

<button ng-click="foobar.trigger()">Click me!</button>

如果这不起作用,有没有办法引入第三个指令来实现它？像这样？

<button ng-click="trigger()" target-directive="foobar">Click me!</button>

谢谢!

Answer 1

听起来你需要一个有角度的服务.http://docs.angularjs.org/guide/dev_guide.services

这将允许您跨指令共享功能.

这是一个类似的问题:在指令之间共享数据

Answer 2

在任何组件之间完成应用程序范围通信的一种简单方法是使用全局事件(从$ rootScope发出).例如:

JS:

app.directive('directiveA', function($rootScope)
{
    return function(scope, element, attrs)
    {
        // You can attach event listeners in any place (controllers, too)

        $rootScope.$on('someEvent', function()
        {
            alert('Directive responds to a global event');
        });
    };
});

HTML:

<button ng-click="$emit('someEvent')">Click me!</button>

在这里,您从子范围发出一个事件,但它最终会到达$rootScope并运行上一个侦听器.

这是一个实例:http://plnkr.co/edit/CpKtR5R357tEP32loJuG？p = preview