Это структура моей страницы.
// app.html
<wrapper ng-if="initialized && $root.user.type!='guest'">
<header-component></header-component>
<div class="app-body">
<sidebar-component></sidebar-component>
<main class="main-content" style="height:{{$root.pageHeight}}px; overflow-y: scroll">
<ng-view></ng-view>
</main>
<aside-component></aside-component>
</div>
</wrapper>
Теперь в директиве ng-view у меня есть контроллер, который должен передавать данные компоненту заголовка. Как видите, ng-view каким-то образом не связан с компонентом заголовка.
Скажем, экран ng-view controll now:
// some-screen.js
$scope.foo = "bar";
И хочу, чтобы в шапке отображалось bar.
Я могу сделать это как с помощью $ rootScope (без каких-либо событий), так и с помощью события $ broadcast.
Первый метод - с использованием $ rootScope - как есть - без чего-либо:
// some-screen.js
$rootScope.foo = "bar";
// header.js
app.directive("headerComponent", ($rootScope) => {
return {
templateUrl: "/structure/header/header.html",
scope: {},
link: function($scope, element, attrs) {
console.log($rootScope.foo) // "bar"
}
}
});
Второй способ - использование события $ broadcast
// some-screen.js
$rootScope.$emit("SomeNameOfTheEvent", $scope.foo);
// header.js
app.directive("headerComponent", ($rootScope) => {
return {
templateUrl: "/structure/header/header.html",
scope: {},
link: function($scope, element, attrs) {
$rootScope.$on("SomeNameOfTheEvent", function(event, info) {
console.log(info.foo) // "bar"
});
}
}
});
Теперь обратите внимание на две вещи при использовании события $ broadcast:
Вам нужно указать имя для этого события - в большом приложении это может быть сложно - поскольку вы, вероятно, не запомните имена, которые вы задаете во время кодирования. А сидеть и думать о хороших именах - пустая трата времени. Возможно, вам потребуется создать документацию, чтобы повторно использовать имя события из других мест в приложении - иначе вы по ошибке попытаетесь использовать то же событие, но с неправильными именами.
Они оба делают одно и то же - $ broadcast просто требуется больше кода для работы.
Что мне не хватает, AngularJS, вероятно, для чего-то создал событие $ broadcast.
$rootScope, а не о литье с помощью$emitили$broadcast. 04.11.2018