无法从 angularjs 中的父控制器广播事件

Question

我有两个具有父子关系的控制器：

这是父控制器的路由：

angular.module('app')
  .config(function ($stateProvider) {
    $stateProvider
      .state('data-show', {
        url: '/data',
        templateUrl: 'app/data.html',
        controller: 'DataCtrl'
      });
  });

这是父控制器的 HTML：

<div class="block-header">
   ...
   ...
    <div ng-include="'components/child_page.html'"></div>
</div>

父控制器代码：

angular.module('app')
  .controller('DataCtrl', function ($scope) {

      $rootScope.$broadcast('someEvent', [1,2,3]);
 });

子控制器是child_page.html页面的一部分，如上所示，使用ng-include标签包含在父页面中。

这是子控制器的外观：

angular.module('app')
    .controller('childCtrl', function ($scope) {

        $scope.$on('someEvent', function(event, mass) {
            console.log('EVENT CALLED');
        });
  });

子页面的 HTML：

<div ng-controller="childCtrl">
    <div id="myGrid"></div>
</div>

但即使我从父控制器广播事件，该事件也不会在子页面中被调用。

Answer 1

我正在回答我自己的问题，希望对某人有所帮助。

正如Nikos Paraskevopoulos 所建议的，当我尝试从父控制器广播事件时，子控制器未加载。

所以我把父控制器改成：

angular.module('app')
  .controller('DataCtrl', function ($scope,$timeout) {

      $timeout(function () {
        $scope.$broadcast('someEvent', [1, 2, 3]);
      }, 300);

 });

我添加了 300 毫秒的延迟，以允许加载子控制器。

Answer 2

来自cmets：

我敢打赌，原因是广播事件时子控制器尚未加载 - 所以没有人可以听。

而且似乎得到了验证：

在广播事件之前，我正在写信给控制台“广播”，并且在子控制器的第一行，我正在写信给“控制台子控制器已加载”。如果我现在检查控制台，我首先会看到“广播”消息，然后是“加载子控制器”。

查看ng-include 的文档，它会在加载内容时发出$includeContentLoaded 事件。所以第一种方法是：

// parent controller:
$rootScope.$on('$includeContentLoaded', function() {
    $rootScope.$broadcast('someEvent', [1,2,3]);
});

稍后可以使用事件的参数对其进行优化。