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