Question

我尝试使用自定义指令验证输入：

.directive('customValidation', function () {
        return {
            require: 'ngModel',
            link: function (scope, element, attr, ngModelCtrl) {
                function fromUser(text) {
                    element.bind("keydown keypress", function (event) {
                        if (!(event.keyCode >= 48 && event.keyCode <= 57)) {
                            return undefined;
                        }
                    })
                }
                ngModelCtrl.$parsers.push(fromUser);
            }
        };
    });

但它不起作用。任何字符都通过验证。我做错了什么？

Answer 1

所以基本上你想要实现的是检查输入是否只包含数字。至少这是我从你的解释和示例代码中可以理解的。

首先，您使用的是parser，用于清理和转换从DOM传递给模型的值。之后验证到来。如果你只想检查是否只写了数字，那么你需要这样的东西：

ngModel.$validators.validCharacters = function(modelValue, viewValue) {
  var value = modelValue || viewValue;
  return /[0-9]+/.test(value);
};

我建议阅读API文档，因为它们会非常彻底地解释所有ngModelController功能：click here for thorough docs

其次，每次调用解析器时都绑定到一个事件。每次更改输入元素的内容时都会调用解析器。如果您在输入中键入每次这个词，最终会将事件绑定九次！除了因为你的第一个事件已被解雇之后，在你改变某事之后绑定到事件的事实为时已晚。

在验证指令中使用element.bind

1 个答案: