Директивно-директивная связь в 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

Одним из простых способов осуществления связи между любыми компонентами в рамках приложения является использование глобальных событий (генерируемых из $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

Answer 2

Похоже, вам нужен угловой сервис. http://docs.angularjs.org/guide/dev_guide.services

Это позволит вам делиться функциональностью между директивами.

Вот похожий вопрос: обмен данными между директивами

Answer 3

При разговоре по irc оказалось, что в общении нет необходимости:

У меня есть директива с ограниченным атрибутом, которая выполняет некоторые манипуляции с DOM над своим родительским элементом, когда он "срабатывает"

Решение состоит в том, чтобы сохранить логику внутри той же директивы и просто применить изменения dom к родителю. http://jsfiddle.net/wt2dD/5/

scope.triggerSmthOnParent = function () {
    element.parent().toggleClass('whatewer');
}