javascript - Angular Controller $on 仅在调用 $broadcast 的 Controller 中初始化时才会启动

Question

我正在尝试创建一个 Controller 来获取错误消息并处理它们:

ngLogin.controller('ErrorCtrl', ['$scope', '$rootScope', function($scope, $rootScope) {
  $scope.$on('ngError', function(event, args) {
    $scope.displayErrors(args);
  });

  $scope.displayErrors = function(errors) {
    alert(errors);
  }
}]);

其他 Controller 旨在像这样广播错误:

ngLogin.controller('LoginCtrl', ['$scope', 'LoginService', '$controller', '$rootScope', function($scope, LoginService, $controller, $rootScope) {
    $scope.login = function(callback) {
        LoginService.login($scope.user.username, $scope.user.password, function(token) {
            //SUCCESS
        }, function(errors) {
            $rootScope.$broadcast('ngError', errors);
        });
    };
}]);

我的问题是，如果没有将以下代码添加到每个广播 Controller ，这将无法工作:

$scope.ErrorCtrl = $scope.$new();
$controller('ErrorCtrl', {
    $scope: $scope.ErrorCtrl
});

index.html

<script src="app.js"></script>
<script src="../src/LoginService.js"></script>
<script src="../src/LoginCtrl.js"></script>
<script src="../src/ErrorCtrl.js"></script>

难道没有别的办法吗？我宁愿不必在每个需要此错误处理的 Controller 中使用最后一段代码。当我删除它时，ErrorCtrl 永远不会收到该事件。

Answer 1

我会说创建一个服务将负责仅显示错误消息并在应用程序运行阶段有一个事件监听器代码。

app.run(function($rootScope, errorService){
   //listner here
   $rootScope.$on('ngError', function(event, args) {
    $scope.displayErrors(args);
  });
});
app.service('errorService', function(){
   var errorService = this;
   errorService.displayErrors = function(errors){
       alert(errors)
   };
})

---

或者更方便的方法是调用服务 displayErrors 方法以在您需要时显示错误消息，通过它您可以从应用程序中消除基于事件的方法。

ngLogin.controller('LoginCtrl', ['$scope', 'LoginService', '$controller', '$rootScope', 'errorService', function($scope, LoginService, $controller, $rootScope, errorService) {
    $scope.login = function(callback) {
        LoginService.login($scope.user.username, $scope.user.password, function(token) {
            //SUCCESS
        }, errorService.displayErrors); //call display error method here.
    };
}]);