$viewContentLoaded 在 Angular ngRoute 应用程序中被多次触发答案

【问题标题】：$viewContentLoaded gets triggered multiple times in Angular ngRoute application$viewContentLoaded 在 Angular ngRoute 应用程序中被多次触发
【发布时间】：2016-04-01 12:46:54
【问题描述】：

我有一个非常简单的设置两个选项卡，主页和管理：

  $routeProvider
             // route for the home page
             .when('/home', {
             templateUrl : 'views/home.html',
             controller  : 'myCtrl',
             controllerAs: 'vm',
             resolve:{
                 loadDropDowns:function(DataSvc,$rootScope){
                    
                        return DataSvc.GetDropDowns();
                    
                 }
             }
         })
         // route for admin page
         .when('/admin',{
             templateUrl : 'admin/templates/admin.html'             
         })

在控制器中，我有一个 $viewContentLoaded 事件的侦听器像这样：

$rootScope.$on('$viewContentLoaded', function(event){
        console.log(" viewContentLoaded fired ");
      });

每次我点击主页选项卡时，事件处理程序都会触发两次，所以第一次是 2 ，然后是 4 ，然后是 8 等等......

我在加载下拉菜单时广播了另一个事件，对于一个广播事件，我也得到了处理程序的多次触发。

 $rootScope.$broadcast('dropDownsSet');

并且在同一个控制器中：

    $rootScope.$on('dropDownsSet', function(event, mass) {}

也被执行多次..（与上面相同，每次事件处理程序触发的次数加倍）

我不知所措，这种疯狂的原因可能是什么？

【问题讨论】：

标签： angularjs dom-events ngroute

【解决方案1】：

移动事件绑定代码

$rootScope.$on('$viewContentLoaded', function(event){
  console.log(" viewContentLoaded fired ");
});

从myCtrl 控制器到某个主应用程序（父）控制器。现在发生的情况是，每次您导航到 Home 选项卡时，myCtrl 都会被实例化，从而在 $rootScope 上再注册一个事件侦听器。

【讨论】：

这是一个很好的建议。谢谢！！这是父控制器。注册新事件时有没有办法清除所有其他事件？
您可以删除事件处理程序（请参阅 Ved 的回答），但我认为最好设计您的控制器和事件以便不需要它。
感谢您的帮助，我已经尝试了好几天了。

【解决方案2】：

$rootScope.$on('dropDownsSet', function(event, mass) {}

$rootScope 侦听器事件不会被芳香地破坏。您需要使用 $destroy 将其销毁。最好使用$scope.$on 作为监听器，$scope 会自动销毁。

$scope.$on('dropDownsSet', function(event, mass) {}

或者，

  var customeEventListener = $rootScope.$on('dropDownsSet', function(event, mass) {

    }

 $scope.$on('$destroy', function() {
        customeEventListener();
    });

【讨论】：

感谢 Ved，这非常有帮助