我在哪里将所有控制器使用的事件监听器代码放在AngularJS中？

Question

我想在我的AngularJS应用程序中有一些事件监听器代码,它将适用于所有控制器的范围.

我基本上想要在某处定义以下内容:

    document.addEventListener("online", onOnline, false);
    document.addEventListener("offline", onOffline, false);

    function onOnline() {
        console.log("just got online event");
        $scope.noNetwork = false;
    }

    function onOffline() {
        console.log("just got offline event");
        $scope.noNetwork = true;
    }

无论哪个控制器范围当前处于活动状态,它都将接收事件.

Answer 1

试试$rootScope:

var app = angular.module("yourModule",[]);
app.run(function($rootScope){
   document.addEventListener("online", onOnline, false);
   document.addEventListener("offline", onOffline, false);

   function onOnline() {
        $rootScope.$apply(function(){
            console.log("just got online event");
            $rootScope.noNetwork = false;
        });
    }

    function onOffline() {
        $rootScope.$apply(function(){
             console.log("just got offline event");
             $rootScope.noNetwork = true;
        });
    }
});

由于范围继承,$ rootScope的属性将由所有子范围继承.请注意,此事件发生在角度之外,$apply在这种情况下使用也是必要的.您的所有子范围都可以$观察noNetwork更改.像这样:

$scope.$watch('noNetwork',function(newValue){
//Handle your tasks here.
});

另一种选择是创建一个服务来保存noNetwork属性并将该服务注入您的控制器.