114

试图找到 AngularJS 的一些基本信息$rootScope.$broadcast，但是 AngularJS 文档并没有多大帮助。简而言之，我们为什么要使用它？

此外，在 John Papa 的Hot Towel模板中，公共模块中有一个自定义函数，名为$broadcast：

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

我不明白这是在做什么。所以这里有几个基本问​​题：

1）$rootScope.$broadcast做什么？

$rootScope.$broadcast2)和有什么区别$rootScope.$broadcast.apply？

4

5 回答 5

159

$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)}
})
于 2014-07-18T18:58:32.157 回答
106

  1. 做什么$rootScope.$broadcast？

    $rootScope.$broadcast正在通过应用程序范围发送事件。该应用程序的任何子范围都可以使用简单的：$scope.$on().

    当您想要到达不是直接父级的范围时发送事件特别有用（例如父级的分支）

    ！！！但是，不要做的一件事是$rootScope.$on从控制器中使用。$rootScope是应用程序，当你的控制器被销毁时，事件监听器仍然存在，当你的控制器被再次创建时，它只会堆积更多的事件监听器。（因此一个广播将被多次捕获）。改为使用$scope.$on()，侦听器也会被破坏。

  2. $rootScope.$broadcast& 和有什么不一样$rootScope.$broadcast.apply？

    有时您必须使用apply()，尤其是在使用指令和其他 JS 库时。但是，由于我不知道该代码库，因此我无法判断这里是否是这种情况。

于 2015-04-17T04:16:20.543 回答
33

$rootScope.$broadcast是引发所有子作用域都可以监听的“全局”事件的便捷方式。您只需要用于$rootScope广播消息，因为所有后代范围都可以侦听它。

根范围广播事件：

$rootScope.$broadcast("myEvent");

任何子 Scope 都可以监听事件：

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

为什么我们使用 $rootScope.$broadcast？您可以$watch用来监听变量的变化并在变量状态发生变化时执行函数。但是，在某些情况下，您只想引发应用程序的其他部分可以侦听的事件，而不管范围变量状态的任何变化。这是$broadcast有帮助的时候。

于 2014-12-22T20:02:02.117 回答
24

传递数据！！！

我想知道为什么没有人提到$broadcast接受可以传递参数的参数Object

例子：

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

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

$scope.$on('status_updated', function(event, obj){
    console.log(obj.status); // 10
})
于 2016-11-08T12:10:32.783 回答
8

$rootScope.$broadcast 有什么作用？

它将消息广播到整个 Angular 应用程序中的各个侦听器，这是将消息传输到不同层次级别的范围（无论是父级、子级还是兄弟级）的非常强大的方法

同样，我们有 $rootScope.$emit，唯一的区别是前者也被 $scope.$on 捕获，而后者仅被 $rootScope.$on 捕获。

参考示例：- http://toddmotto.com/all-about-angulars-emit-broadcast-on-publish-subscribing/

于 2014-11-05T10:13:36.417 回答