$broadcast 和 $on 不适用于基于 ng-if 的模板答案

【问题标题】：$broadcast and $on is not working on template which is based on ng-if$broadcast 和 $on 不适用于基于 ng-if 的模板
【发布时间】：2013-08-21 12:12:58
【问题描述】：

我在从父范围到子范围的广播事件中遇到问题，我认为根核心可能是子控制器未初始化。

假设我有html:

<div ng-controller="ParentController">
  <button type="button" ng-click="show()">Show Template</button>

  <div ng-if="showTemplate">
    <div ng-include="'template.html'" ng-controller="ChildController"></div>    
  </div>

</div>

和控制器：

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

myApp.controller('ParentController', ['$scope', function ($scope) {   
  $scope.show = function(){
    $scope.showTemplate = true;
    $scope.$broadcast("showEvent", 1);
  };

}]);

myApp.controller('ChildController', ['$scope', function ($scope) {
  $scope.$on("showEvent", function(event, id){
    alert(id);
  });
}]);

当按钮Show Template被点击时，标志showTemplate被设置为显示模板，同时一个事件showEvent被广播到子作用域。

但ChildController 中的作用域无法捕获此事件，因为子控制器可能稍后会初始化。

有什么办法可以解决这个问题吗？

这里的代码：http://plnkr.co/edit/HV6aco

【问题讨论】：

标签： javascript angularjs

【解决方案1】：

将广播的调用包装成$timeout，我相信你很高兴

$timeout(function() { $scope.$broadcast("showEvent"); },0);

【讨论】：

仅供参考，default value of the second parameter 到 $timeout 是 0。
正如正确答案中所解释的，捕获事件的控制器不是在广播时创建的。因此，通过添加超时，我们在广播之前设置了延迟。
就我而言，我必须使用 10 作为 $timeout 值。 0 仍然无法正常工作

【解决方案2】：

由于您使用的是ng-if，因此在触发事件时，带有ChildController 的DOM 节点并不存在。

我看到了两种可能性：

将ChildController移动到ng-if上方的某处
使用ng-show 而不是ng-if

查看更新的 plunkr：http://plnkr.co/edit/NluFBJ

但是，如果您真的只对在创建模板时收到通知感兴趣，那么我建议您只使用@Roy Daniels 解决方案，而根本不要使用$broadcast/$on，而是将要运行的代码直接放入ChildController，因为每次创建模板时都会执行。

【讨论】：

感谢您的解决方案，第二种方法非常适合我的情况
很高兴能帮到你:)

【解决方案3】：

你不需要在这里使用 $broadcast/$on。每次显示模板时，ChildController 中的代码都会被初始化并运行。

看看这个 Plunker：http://plnkr.co/edit/liON6k?p=preview

【讨论】：

感谢您的回答，问题是我需要将1 从父母发送给孩子，我已经更新了我的问题
在这种情况下，我猜ng-show 选项可能更适合。如果您只是想在创建模板时收到通知，我会说@Roy 的解决方案是最好的。
哦，好吧...是的，您的原始问题没有具体说明。在这种情况下，@Christoph 的答案是最好的。