angularjs - Angular - 我可以广播来自 Angular 应用程序外部的消息吗？

Question

我有一个场景，我需要非 Angular 代码(在本例中为 Facebook 和 Twitter JS sdk)来广播 Angular Controller 可以监听的事件。为什么？初始页面加载后，我通过 AJAX 加载和修改页面中的内容。内容附有多个喜欢/推文按钮(如博客/聚合器的首页)。我想在 Facebook 的“赞”按钮或 Twitter 的“分享”按钮上发生点击时添加事件 Hook - 页面中有一些，每当获取新内容时，每个都会发生变化(同样，通过 ajax )。

现在，SDK 以不同的方式处理这个问题:

推特

twttr.events.bind('click', function(event){
    // here I'd like to somehow
    // $rootScope.$broadcast("twitter:clicked", event.currentTarget)
});

Facebook

FB.Event.subscribe("edge.create", function(resp) {
    // here I'd like to somehow
    // $rootScope.$broadcast("facebook:clicked", resp)
});

一些 Controller

app.controller("SomeController", ['$scope', function($scope) {
    $scope.$on("facebook:clicked", function(event, resp) {
        // do something with resp
    });

    $scope.$on("twitter:clicked", function(event, target) {
        // do something target
    });
}])

这个想法是绑定(bind)这些事件处理程序一次，然后在相关 Controller 中处理广播消息，即使这些 Controller 在获取新内容时重新创建。

所以基本上，我正在寻找的是一种连接到现有的和已经初始化的 Angular 应用程序的 $rootScope 的方法。和 $broadcast一条消息，尽管不是应用程序的一部分。希望这是有道理的。谢谢。

Answer 1

您可以绑定(bind)到 Angular 代码中的其他应用程序(在最有可能创建链接的指令中)。这样您就可以访问 $rootScope .

或者，如果您手动引导您的应用程序，您可以保留对注入(inject)器的引用并获取 $rootScope :

var injector = angular.bootstrap(element, ["myAppModule", ...]);
var $rootScope = injector.get("$rootScope");

无论如何不要忘记调用$apply在外部事件之后。