AngularJS 中的 oninput 事件属性

Question

我正在构建一系列输入字段，这些字段在达到最大长度时会自动切换。这通过检查 ng-keyup 事件的值的长度来工作，但这有一个小问题，可以通过使用 oninput 事件来解决。然而，这似乎并不存在于 Angular?

我要解决的问题：

当我快速输入最大数量的字符（在我的例子中是两位数字，可以很快输入）时，第一个 keyup 在输入两个字符并跳转到下一个字段后触发。第二个 keyup 仅在 Tab 键后注册，因此它会在下一个字段上触发。这会导致不需要的行为。

重现检查this fiddle（jQuery，因为它可以让我快速重现我正在寻找的问题和解决方案），填写"month"和"year" 字段，然后在 "day" 字段中快速输入 2 位数字。当完成得足够快时，焦点会一直跳到 "year"（因为第二个 keyup 在 "month" 处于焦点时被触发）。

当改用 .on('input', ...) 时，这个问题就消失了。但是，我不想在 jQuery 中使用它，而是在 Angular 中将其用作属性，例如 ng-keyup。这可能吗？如果不可能，我该如何用另一种方式解决这个问题？

Answer 1

看起来您正在该 jsfiddle 中使用 jquery。而在 angular 中绑定 oninput 事件，您可以使用：

大多数这种 DOM 操作必须在指令中进行。只是为了演示，我将它添加到控制器中：

angular.element(document.querySelectorAll("input")).on("input", function (event) {

    var $input = angular.element(event.target),
        maxlength = $input.attr('max').length;

    if (this.value.length >= maxlength) {
        this.nextElementSibling.tagName==="INPUT" ? this.nextElementSibling.focus() : this.blur();
    }

});

DEMO

AngularJS 中的 oninput 事件属性

oninput event attribute in AngularJS

javascript

dom-events

angularjs