Угловой, общаться между модулями

У меня есть следующие настройки для моего проекта:

  • Основной угловой модуль mainApp, содержащий фабрику EventBus
  • Первый модуль app1 с введенным mainApp
  • Второй модуль app2 с введенным mainApp

app1 и app2 - это два модуля, размещенные на одной странице, оба имеют встроенное mainApp.

Я пытаюсь установить связь между app1 и app2 с помощью фабрики EventBus, которая определена в mainApp. К сожалению, я не могу заставить его работать (app1 не перехватывает событие app2 и наоборот).

Как я должен решить это? Я выбрал неправильный подход?

EventBus.subscribe("App1Ctr.event", function (event, data) {
    console.log("App2handler");
    $scope.name = data.newVal;
});


$scope.fireEvent = function () {
    EventBus.broadcast("App2Ctr.event", {"newVal": "App2Ctr"});
};

Вот плнкр

2 ответа

Мне удалось найти решение. Метод трансляции в EventBus должен выглядеть примерно так:

_broadcast = function(eventName, data) {
    console.log("EventBus broadcast: " + eventName);
    angular.element(document.getElementById('app1')).scope().$root.$emit(eventName, data);
  };

Так как оно должно получить угловое приложение по ID, я буду дополнительно использовать EventDispatcher для обработки этого.

Вам нужно изменить способ введения зависимостей. Ваш main.js должен содержать это:

var mainApp = angular.module("mainApp", ["app1", "app2"])

Ваши два app1.js а также app2.js может отбросить требование зависимости от mainApp:

var app1 = angular.module("app1", [])

а также

var app2 = angular.module("app2", [])

Ваш код инициализации в index.html становится

<script>
    angular.element(document).ready(function() {
        angular.bootstrap(document, ["mainApp"]);
    });
</script>

Вам нужно будет изменить ссылки на {{name}}Кроме того, чтобы они включали точку (из-за всего прототипа наследования вещь в угловых). Смотрите этот plunkr, и этот вопрос для более подробной информации о $broadcast, $emit, $on, а также $rootScope,

Другие вопросы по тегам