在AngularJS中只注册一次事件监听器。

9 浏览
0 Comments

在AngularJS中只注册一次事件监听器。

我正在从我的导航栏控制器向另一个控制器广播一个事件,但是如果我多次初始化该控制器(当我在应用程序中前后跳转时),在我的$on事件上执行的函数会运行多次,因为它被多次注册。

$rootScope.$on('submitBookingDialog', function(){
    submitBookingDialog();
});

我应该如何防止submitBookingDialog()发生多次?

我找到了一个解决方案,但我不知道是否理想。

0
0 Comments

在AngularJS中,有时我们只需要在特定事件发生时执行一次回调函数,而不是每次事件触发都执行。这种情况下,我们可以使用AngularJS的事件监听器。然而,有时候我们希望只注册一次事件监听器,以避免重复执行回调函数。

上面的代码给出了一种解决方法。在AngularJS的.run函数中,我们创建了一个名为"once"的新函数,它接受事件名和回调函数作为参数。在该函数内部,我们使用$on函数注册事件监听器,并在回调函数执行后立即取消事件监听。这样,我们就确保了回调函数只会被执行一次。

在应用程序的模块中使用上述代码后,我们只需要调用"once"函数而不是"$on"函数来注册事件监听器。例如,可以这样调用"once"函数来监听"submitBookingDialog"事件:

$rootScope.once('submitBookingDialog', function() {
    submitBookingDialog();
});

这样,无论"submitBookingDialog"事件被触发多少次,回调函数"submitBookingDialog"都只会被执行一次。这种方法可以让我们更方便地注册只执行一次的事件监听器,使代码更加简洁和易于理解。

0
0 Comments

问题的原因是在AngularJS中,当我们使用$rootScope.$on()方法注册事件监听器时,事件监听器将在每次事件发生时都会被调用,即使我们只想监听一次事件。这可能会导致不必要的重复调用和性能问题。

解决方法是在事件监听器内部手动取消事件监听器。在给定的代码示例中,我们使用了一个变量removeListener来存储返回的函数签名,然后在适当的时候调用它来取消事件监听器。这样,事件监听器只会在第一次事件发生时被调用,之后会被自动取消。

感谢正确的答案,$on操作返回函数签名,因此只需在适当的时候调用它来取消事件监听器。

这是正确的做法。你可以在这里找到类似的答案。

0
0 Comments

问题的出现原因是在AngularJS中重复注册事件监听器。这可能会导致事件在每次触发时执行多次。

要解决这个问题,首先需要确定是否需要在$rootScope上发送事件。如果不需要,则可以在$scope上注册事件处理程序。当控制器的作用域被销毁时,事件处理程序也会被销毁。然后,可以通过$scope.$emit或$scope.$broadcast根据控制器的层次结构发送事件。

为了销毁事件监听器,只需调用在注册监听器时返回的注销函数:

var offSubmitBookingDialog = $rootScope.$on('submitBookingDialog', function(){
    submitBookingDialog();
});
$scope.$on('$destroy', function() {
    // 当作用域被销毁时调用注销函数
    offSubmitBookingDialog();
});

通过这种方式,监听器在作用域被销毁时会被正确地注销,避免重复执行事件处理程序的问题。

0