AngularJS ng-init $broadcast在监听器注册之前调用

AngularJS ng-init $broadcast called before listeners registered

本文关键字:注册 调用 监听器 ng-init broadcast AngularJS      更新时间:2023-09-26

我正在尝试使用$broadcast

向不确定数量的侦听器广播初始值

我正在调用$rootScope。$broadcast with ng-init。广播在页面加载时正常工作,但侦听器未注册。然而,随后的呼叫被正确接听。

html;

<div class="panel panel-body" ng-controller="Location" ng-init="setActiveLocation({{ defaultLocation }})">

方法;

    $scope.setActiveLocation = function(location) {
        console.log('broadcast:', location);
        $rootScope.$broadcast('setActiveLocation', location);
    };

一个侦听器;

       $scope.$on('setActiveLocation', function(event, location)
            {
                console.log('recieved: ', event)
                $scope.clearHistory();
                $scope.refreshHistory(location);
            });
我的问题是这样的;Ng-init应该在页面准备好时调用,那么为什么要在侦听器准备好之前调用它呢?我应该做些什么来预防这种情况?

"ng-init应在页面准备好时调用"。这种假设是错误的。看看ngInitDirective(当前为angular 1.4.7)。

var ngInitDirective = ngDirective({
  priority: 450,
  compile: function() {
    return {
      pre: function(scope, element, attrs) {
        scope.$eval(attrs.ngInit);
      }
    };
  }
});

pre-link阶段执行,与页面的状态无关。

所以我猜你的设置是这样的:

<a ng-init="someFunctionInA()">
    <b ng-init="someFunctionInB()"></b>
</a>

如果连接到a的控制器执行$broadcast,并且在连接到b的控制器中注册了侦听器,那么在侦听器注册之前就会触发广播。

解决方案:不要使用ng-init。从你的指令中调用init函数。从指令apost-link函数调用广播函数。当pre-link从外部到内部指令执行时,post-link反之亦然,因此您的内部控制器(带有侦听器)将在外部控制器执行广播之前准备好。