在AngularJS中只注冊一次事件偵聽器

Question

我正在從導航欄控制器向另一個控制器廣播一個事件，但是如果我多次初始化控制器（當我正在通過應用程序前進和后退時），在我的$on事件$on執行的函數會多次運行，因為它已經注冊多次。

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

如何防止submitBookingDialog()多次發生？

我找到了解決方案 ，但我不知道它是否理想。

Answer 1

首先，你需要在$rootScope上發送事件嗎？ 如果沒有，那么你可以在$scope上注冊你的事件處理程序。 每當您的控制器范圍被銷毀時，事件處理程序都將被銷毀。 然后，您將通過$scope.$emit或$scope.$broadcast發送事件，具體取決於您的控制器層次結構。

話雖這么說，你需要做的就是銷毀你的事件監聽器是調用注冊監聽器時返回的注銷函數：

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

$scope.$on('$destroy', function() {
    // Call the deregistration function when the scope is destroyed
    offSubmitBookingDialog();
});

Answer 2

這似乎是為我做的：

 var removeListener = $rootScope.$on('submitBookingDialog', function(){ submitBookingDialog(); // Remove listener removeListener(); }); 

Answer 3

為了后代，我最終做到了這一點：

.run(function($rootScope) {
    $rootScope.once = function(e, func) {
        var unhook = this.$on(e, function() {
            unhook();
            func.apply(this, arguments);
        });
    };
})

因為我一直需要在一些地方這樣做，這才最終變得更加清潔。
有了這個，你現在可以只調用once而不是$on ：

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

Answer 4

我遇到了類似的情況，所以我寫了一個小庫，讓pub / sub更容易。

https://github.com/callmehiphop/hey

Answer 5

也許你應該取消訂閱控制器銷毀事件

var removeSubmitBookingDialog = $rootScope.$on('submitBookingDialog',submitBookingDialog);
$scope.$on("$destroy", removeSubmitBookingDialog);