Question

我有需要当页面加载时，用户按下回车键，它会作为按钮执行，我写了一个dirrective。我使用它，但它有一个问题，该指令在几个页面中使用，当我加载其他页面时，之前的操作是触发，我加载的页面越多，它触发的动作越多，如何修复它。

dir.directive('defaultEnter', [ '$timeout', function($timeout) {
    return {
        restrict: 'A',
        require: '?form',
        scope:{
          ngDisabled: '=',
        },
        link: function (scope, element, attr) {

            $document.on('keydown', function(evt) {
                var which = evt.which;
                if (which == 13) {

                    scope.$apply(function (){
                        scope.$parent.$eval(attr.ngClick);
                    });                      

                    evt.preventDefault();
                    evt.stopPropagation();
                }
            });
        }
    }
}]);

Answer 1

通过监听$destroy事件，每当附加指令的元素被销毁时，删除keydown处理程序。

link: function (scope, element, attr) {
    var handler = function(evt) {
        var which = evt.which;
        if (which == 13) {

            scope.$apply(function (){
                scope.$parent.$eval(attr.ngClick);
            });                      

            evt.preventDefault();
            evt.stopPropagation();
        }
    };

    var cleanup = function () {
        $document.off('keydown', handler);
    };

    $document.on('keydown', handler);
    element.on('$destroy', cleanup);
}

$ document侦听angular指令中的键事件

1 个答案: