Angularjs广播和查询

我正在学习angularJS广播和发射。下面的代码似乎不起作用，即FirstCtrl和SecondCtrl未接收广播消息。任何

<div ng-controller="FirstCtrl">
    <div ng-controller="SecondCtrl">  </div>    
</div>

var app = angular.module("myapp", []);

function FirstCtrl($scope){
    this.name = "xxxx";
    this.age  = 31;

    $scope.$on("message", function(e, opt){
        console.log("received message First");
    });
}
function SecondCtrl($scope){
    this.name = "yyyy";
    this.age  = 31;
    $scope.$on("message", function(e, opt){
        console.log("received message second");
    });

}

app.controller("FirstCtrl", FirstCtrl);
app.controller("SecondCtrl", SecondCtrl);
app.run(function($rootScope){
    $rootScope.$on("message", function(e,opt){
        console.log("root receive message");
    });

    $rootScope.$broadcast("message", { message : "root broadcast"});
});

var-app=angular.module（“myapp”，[]）；
函数FirstCtrl（$scope）{
this.name=“xxxx”；
年龄=31岁；
$scope.$on（“消息”，功能（e，opt）{
日志（“先收到消息”）；
});
}
函数SecondCtrl（$scope）{
this.name=“yyy”；
年龄=31岁；
$scope.$on（“消息”，功能（e，opt）{
日志（“第二条收到的消息”）；
});
}
应用控制器（“FirstCtrl”，FirstCtrl）；
应用控制器（“SecondCtrl”，SecondCtrl）；
app.run（函数（$rootScope）{
$rootScope.$on（“消息”，函数（e，opt）{
日志（“根接收消息”）；
});
$rootScope.$broadcast（“消息”，{message:“根广播”}）；
});

发生这种情况是因为执行

运行

块时，没有一个控制器被实例化

要解决此问题，请使用

$timeout

，以便有足够的时间实例化控制器：

$timeout(function() {
    $rootScope.$broadcast("message", { message : "root broadcast"});
}, 100)

---

这是因为当执行

run

块时，没有一个控制器被实例化

要解决此问题，请使用

$timeout

，以便有足够的时间实例化控制器：

$timeout(function() {
    $rootScope.$broadcast("message", { message : "root broadcast"});
}, 100)

---

你的例子说明了一个要点。在应用程序的生命周期中创建和销毁控制器。他们可能错过广播活动。另一方面，服务是单例的，并且在应用程序的整个生命周期内都可用。因此，在服务中记录您的事件

app.factory("messageService", function($rootScope) {
     var lastMessage = {};
     function getMessage() { return lastMessage };
     function setMessage(m) { lastMessage = m };
     //record events
     $rootScope.$on("message" function(e,opt) {
          lastMessage.event = e;
          lastMessage.opt = opt;
     });
     return { getMessage: getMessage,
              setMessage: setMessage
            };
});

然后，控制器可以“跟踪”并订阅事件

app.controller("FirstCtrl", function($scope,messageService) {
     //catch-up
     var message = messageService.getMessage();
     console.log(message.opt.message);
     //subscribe
     $scope.$on("message", function (e,opt) {
          message.event = e;
          message.opt = opt;
          console.log(message.opt.message);
     });
});

在运行块中，确保插入

messageService

app.run(function($rootScope, messageService){
    $rootScope.$on("message", function(e,opt){
        console.log("root receive message");
    });

    $rootScope.$broadcast("message", { message : "root broadcast"});
});

---

AngularJS框架对服务进行惰性实例化。即使run块不使用

消息服务

，也需要对其进行实例化以接收和记录广播事件。

您的示例说明了一个要点。在应用程序的生命周期中创建和销毁控制器。他们可能错过广播活动。另一方面，服务是单例的，并且在应用程序的整个生命周期内都可用。因此，在服务中记录您的事件

app.factory("messageService", function($rootScope) {
     var lastMessage = {};
     function getMessage() { return lastMessage };
     function setMessage(m) { lastMessage = m };
     //record events
     $rootScope.$on("message" function(e,opt) {
          lastMessage.event = e;
          lastMessage.opt = opt;
     });
     return { getMessage: getMessage,
              setMessage: setMessage
            };
});

然后，控制器可以“跟踪”并订阅事件

app.controller("FirstCtrl", function($scope,messageService) {
     //catch-up
     var message = messageService.getMessage();
     console.log(message.opt.message);
     //subscribe
     $scope.$on("message", function (e,opt) {
          message.event = e;
          message.opt = opt;
          console.log(message.opt.message);
     });
});

在运行块中，确保插入

messageService

app.run(function($rootScope, messageService){
    $rootScope.$on("message", function(e,opt){
        console.log("root receive message");
    });

    $rootScope.$broadcast("message", { message : "root broadcast"});
});

---

AngularJS框架对服务进行惰性实例化。即使运行块不使用

消息服务

，也需要对其进行实例化以接收和记录广播事件。

或者，您可以使用以避免将事件发送到超出必要的控制器

$rootScope.$broadcast

将向所有作用域发送事件，如果您有很多控制器/作用域，则可能无法有效地发送事件。在这种情况下，建议有效地使用PubSub模式

---

注意不要忘记取消订阅事件/主题，以避免内存泄漏。

或者，您可以使用以避免将事件发送到超出必要的控制器

$rootScope.$broadcast

将向所有作用域发送事件，如果您有很多控制器/作用域，则可能无法有效地发送事件。在这种情况下，建议有效地使用PubSub模式

注意不要忘记取消订阅事件/主题，以避免内存泄漏