AngularJS：取消订阅事件

Question

In one of my controllers, there is a directive <div keypress-events> that subscribes to pressed keys:

directives.directive('keypressEvents', ['$document', '$rootScope',  function ($document, $rootScope) {
    return {
        restrict: 'A',
        link: function () {
            $document.bind('keydown', function (e) {
                $rootScope.$broadcast('keypress', e, e.which);
            });
        }
    }
}]);

There is also a listener that performs pagination when a users pressed any arrow keys.

var listener = $scope.$on('keypress', function (e, a, key) {
    $scope.$apply(function () {
        $scope.key = key;

        if (key == 39) {
            $scope.currentPage = Math.min($scope.currentPage + 1, $scope.numPages)
        } else if (key == 37) {
            $scope.currentPage = Math.max($scope.currentPage - 1, 1)
        }
    });
})

However, when you navigate to another controller and then go back, the listener will be called twice. So how can I unsubscribe to that event?

I tried only to destroy the listener, but this does not work...

$scope.$on('$destroy', function() {
  listener(); // remove listener.
});  

Answer 1

Because keydown event from directive gets bounded twice when you revisit the page. What you could do is, before moving away from page take care of removing keydown event of directive, for the same place hook on $destroy event of scope .

Code

directives.directive('keypressEvents', ['$document', '$rootScope',  function ($document, $rootScope) {
    return {
        restrict: 'A',
        link: function (scope) {
            var event =  function (e) {
                $rootScope.$broadcast('keypress', e, e.which);
            };
            $document.on('c', event);
            scope.$on('$destroy', function (){
                angular.element($document).off('keydown', event);
            })
        }
    }
}]);

Note : As of jQuery 3.0, .unbind() has been deprecated. It was superseded by the .off() method since jQuery 1.7, so its use was already discouraged.