$ rootScope上$ rootScope $廣播$上：。引發RangeError：最大調用堆棧大小超出

Question

我想在角度來定義頁面的標題是這樣的：

標準PageController：

angular.module('admin').controller('AdminController', 
    function($scope) { 

     // emit an event to rootscope 
     $scope.$emit('setPageTitle','Administration'); 
    } 
); 

然後在一個運行塊：

angular.module('core').run(function($rootScope){ 
    $rootScope.$on('setPageTitle',function(evt,title){ 
     $rootScope.$broadcast('setPageTitle',title); // The error is thrown from this line 
    }); 
}); 

和finnally在PageHeaderController：

angular.module('core').controller('PageHeaderController', 
    function($scope) { 

     $scope.$on('setPageTitle',function(evt, title){ 
      $scope.pageTitle = title; 
     }); 
    } 
); 

這樣，我不需要在每個PageController中注入$rootScope，而只需要$scope，這通常用於其他任務。

但我得到上面標註在第二代碼塊

RangeError: Maximum call stack size exceeded

這個錯誤在該行有什麼不對嗎？我看不出有什麼在這裏引起無窮遠循環，因爲我覺得我只是做畢業論文步驟：

• 發射從孩子
• 手柄rootscope和廣播給孩子
• 手柄在特定的子

Answer 1

從一個不同的名字將努力改變「setPageTitle」事件，嘗試這樣

angular.module('core').run(function($rootScope){ 
    $rootScope.$on('setPageTitle',function(evt,title){ 
     $rootScope.$broadcast('setPageTitleCtrl',title); // The error is thrown from this line - changed 'setPageTitle' to 'setPageTitleCtrl' 
    }); 
}); 

控制器：

angular.module('core').controller('PageHeaderController', 
    function($scope) { 

     $scope.$on('setPageTitleCtrl',function(evt, title){ 
      $scope.pageTitle = title; 
     }); 
    } 
) 

Answer 2

$rootScope.$on('setPageTitle',function(evt,title){ 
    $rootScope.$broadcast('setPageTitle',title); // The error is thrown from this line 
}); 

這是原因嗎？嘗試通過跟蹤方向給出不同的事件名稱。

Answer 3

這裏的原因是$ rootScope又趕上事件的能力它自己播放。因此無限循環發生了。

Here's a very clear explanation on $rootScope's $emit, $broadcast, $on behavior