it-swarm.com.ru

Почему мы используем трансляцию $ rootScope. $ В AngularJS?

Пытался найти некоторую базовую информацию для AngularJS $rootScope.$broadcast, но документация AngularJS мало чем помогает. Проще говоря, почему мы используем это?

Кроме того, внутри шаблона Джона Папы Hot Towel в общем модуле есть пользовательская функция с именем $broadcast:

function $broadcast() {
    return $rootScope.$broadcast.apply($rootScope, arguments);
}

Я не понял, что это делает. Итак, вот пара основных вопросов:

1) Что делает $rootScope.$broadcast?

2) В чем разница между $rootScope.$broadcast и $rootScope.$broadcast.apply?

101
Nexus23
  1. Что делает $rootScope.$broadcast?

    $rootScope.$broadcast отправляет событие через область приложения. Любая дочерняя область этого приложения может поймать его с помощью простого: $scope.$on().

    Особенно полезно отправлять события, когда вы хотите достичь области, которая не является прямым родителем (например, ветвь родителя)

    !!! Однако одна вещь не делать - это использовать $rootScope.$on из контроллера. $rootScope - это приложение, когда ваш контроллер уничтожается, этот прослушиватель событий все еще существует, а когда ваш контроллер будет создан снова, он просто накапливает больше прослушивателей событий. (Таким образом, одна трансляция будет перехвачена несколько раз). Вместо этого используйте $scope.$on(), и слушатели также будут уничтожены.

  2. В чем разница между $rootScope.$broadcast & $rootScope.$broadcast.apply?

    Иногда вам нужно использовать apply(), особенно при работе с директивами и другими библиотеками JS. Однако, поскольку я не знаю эту кодовую базу, я не смогу сказать, так ли это здесь.

85
user1412031

$rootScope в основном функционирует как прослушиватель событий и диспетчер.

Чтобы ответить на вопрос о том, как он используется, он используется в сочетании с rootScope.$on;

$rootScope.$broadcast("hi");

$rootScope.$on("hi", function(){
    //do something
});

Однако использование $rootScope в качестве службы общих событий вашего собственного приложения является плохой практикой, поскольку вы быстро окажетесь в ситуации, когда каждое приложение зависит от $ rootScope, и вы не знаете, какие компоненты прослушивают какие события.

Рекомендуется создавать сервис для каждого пользовательского события, которое вы хотите прослушать или транслировать.

.service("hiEventService",function($rootScope) {
    this.broadcast = function() {$rootScope.$broadcast("hi")}
    this.listen = function(callback) {$rootScope.$on("hi",callback)}
})
154
Code Whisperer

$ rootScope. $ broadcast - это удобный способ вызвать "глобальное" событие, которое могут прослушивать все дочерние области. Вам нужно только использовать $rootScope для трансляции сообщения, так как все области потомка могут его прослушивать.

Корневая область передает событие:

$rootScope.$broadcast("myEvent");

Любое дочернее Scope может прослушать событие:

$scope.$on("myEvent",function () {console.log('my event occurred');} );

Почему мы используем $ rootScope. $ Broadcast? Вы можете использовать $watch для прослушивания изменений переменных и выполнения функций при изменении состояния переменных. Однако в некоторых случаях вы просто хотите вызвать событие, которое могут прослушивать другие части приложения, независимо от каких-либо изменений в состоянии переменной области. Это когда $broadcast полезен.

32
James Lawruk

Передача данных !!!

Интересно, почему никто не упомянул, что $broadcast принимает параметр, где вы можете передать Object, который будет получен $on, используя функцию обратного вызова

Пример:

// the object to transfert
var myObject = {
    status : 10
}

$rootScope.$broadcast('status_updated', myObject);

$rootScope.$on('status_updated', function(event, obj){
    console.log(obj.status); // 10
})
14
Merlin

Что делает $ rootScope. $ Broadcast?

Он передает сообщение соответствующим слушателям по всему приложению angular, что является очень мощным средством для передачи сообщений в области на другом иерархическом уровне (будь то родитель, потомок или братья и сестры)

Аналогично, у нас есть $ rootScope. $ Emit, единственное отличие состоит в том, что первое также перехватывается $ scope. $ On, а второе - только $ rootScope. $ On.

см. примеры: - http://toddmotto.com/all-about-angulars-emit-broadcast-on-publish-subscribeing/

8
Prashant K