Question

在我的angular视图中，我使用指令来呈现input field，它运行正常。但现在我需要对keydown执行一些操作。

ng-keydown适用于我在视图中输入的字段：

<input ng-keydown="tabed($event)" ng-model="myData2"/>

但它不适用于通过指令

呈现的输入字段

<my_input input-value="mydata"></my_input>

指令：

app.directive('myInput', function () {
  return {
    restrict: 'EA',
    template: '<input ng-keydown="tabed($event)" ng-model="inputValue"/>',
    scope: {
        inputValue: '=',
        inputName: '='
    },
    link: function (scope) {

    }
  };
});

我已经尝试了很多，但没有找到任何方法在通过指令呈现的输入字段上触发keydown事件。

这是 Fiddle

Answer 1

那是因为你的指令创建了一个新的子范围，并且在它的链接功能中没有标签功能。您可以通过$ parent引用父项范围。我强烈建议将tabed函数移动到指令中，但如果你只需要它，那么这就是你需要做的改变：

template: '<input ng-keydown="$parent.tabed($event)" ng-model="inputValue"/>',

jsfiddle：http://jsfiddle.net/JJ5UM/1/

Answer 2

我认为您可以使用$watch代替ng-keydown

来达到相同的效果

Fiddle

以下是指令的外观;

app.directive('myInput', function () {
    return {
        restrict: 'EA',
        template: '<input ng-keydown="tabed($event)" ng-model="inputValue"/>',
        scope: {
            inputValue: '=',
            inputName: '='
        },
        link: function (scope) {
            scope.$watch('inputValue', function (now, then) {
                console.debug('yeah, I see the change', now, then);
            });
        }
    };
});

ng-keydown不处理通过指令呈现的输入字段

2 个答案: