防止 $rootScope.$on 多次调用函数

Question

我在控制器顶部有一个 $rootScope.$on 代码。我注意到，每次我 load/call 这个控制器时，$rootScope.$on 监听器都会增加，这意味着它会在你访问控制器时无限期地添加、添加和添加一个监听器。

当我从另一个控制器通过 $rootScope.$emit 调用它时，我注意到它，$rootScope.$on 中的函数被执行了几次，即使它只是一个 emit/broadcast.

$rootScope.$on('listen', function() {
    $scope.displayString();
});

$scope.displayString = function() {
    console.log('test'); // This display 7 times because I visit the controller 7 times
}

是否可以阻止它创建另一个侦听器实例，以便当已经有一个侦听器时，它不会创建一个新的。

Answer 1

当控制器的范围被销毁时，您需要注销事件侦听器。

$on函数returns一个注销函数，调用该函数时将删除侦听器。

所以你可以这样设置：

var deregister = $rootScope.$on('listen', function() {
    $scope.displayString();
});
$scope.$on('$destroy', deregister);

注意：这仅在控制器的范围实际被销毁时才有效（例如，在从 DOM 中删除的指令中或当您导航到不同的路线时）。如果那没有发生，那么您将需要想出一种只注册一次事件侦听器的方法。

防止 $rootScope.$on 多次调用函数

Prevent $rootScope.$on from calling function several times

angularjs

rootscope