Question

我试图在angularJS中创建简单的自定义指令如果用户输入整数，则验证用户是否输入。

如果用户输入一个整数，那么应该出现一条错误消息底部“整数不允许”。

任何想法我怎么能实现这个......？（小提琴会很棒）

还有...

是否可以使用$ scope WITHOUT 。$ watch？

这是检查客户端输入的专业有效方法吗？验证？（这种方法会影响应用程序的性能吗？）

Answer 1

您可以使用ng-pattern来验证它是否是有效号码。其他方式是你提出的，创建一个自定义指令。我将使用notNumber名称，也可以isNumber进行微小更改。

angular.module('app')
  .directive('notNumber', notNumber);

function notNumber() {
  return {
    require: 'ngModel',
    link: function(scope, elem, attr, ctrl) {
      ctrl.$formatters.unshift(function(value) {
        if (value) {
          ctrl.$setValidity('notNumber', Number.isNaN(value));
        }
        return value;
      });
    }
  };
}

在HTML中，

<input type="text" ng-model="model" not-number />

Answer 2

比您预期的更简单....使用ng-pattern

<input type="text" ng-model="model" ng-pattern="\\d+" />

上面文档链接中的演示设置为默认的相同模式。

至于这样做......当然，以表格形式提供用户反馈是正常的。它不会减轻服务器端验证，但必须完成

用于输入验证的Angular自定义指令

2 个答案: