Question

您好我在我的项目中使用了用户名验证器。但是当我开始写一些事情时，它会在达到最小长度后请求每个字符。在这里你可以看到图片。

这是我的耻辱;

在页面中输入解析：

<input type="text" id="regUserName" name="regUserName" required minlength="5" maxlength="15" class="form-control" placeholder="Kullanıcı Adı" data-ng-model="regUserName" username-validator />

这里验证器在ValidationService.js中：

angular.module('BlogAppModule').directive('usernameValidator', function ($http, $q) {
return {
    require: 'ngModel',
    link: function ($scope, element, attrs, ngModel) {
        ngModel.$asyncValidators.usernameAvailable = function (username) {
            return $http.get('/api/CheckUserName/' + username)
            .then(function (response) {
                var warning = document.getElementById("regUserName");
                if (response.data != null) {
                    warning.style.backgroundColor = "red";
                }
                else {
                    warning.style.backgroundColor = "white";
                }
            })
        }
    }
};

}）;

现在我在这里提出一些问题：

这个请求会有问题吗？（就像性能问题一样）
我可以设置此验证，就像我离开文本框然后检查一样用户名？如果可以，我该怎么办？
当用户写＆＃34;。＆＃34;请求不要工作。如何禁用 textinput特殊字符如：＆＃34; 。 - ，！＃＆＃34;等

Answer 1

默认情况下，每次更改时都会将更改写回模型。离开输入字段时，使用ng-model-options="{ updateOn: 'blur' }"元素上的input更新绑定。

如果您还想添加客户端验证，可以添加同步验证器。 $validator将在$asyncValidators之前执行。

  link: function ($scope, element, attrs, ngModel) {
      ngModel.$asyncValidators.usernameAvailable = function (username) {
          // your server side validation
      };
      ngModel.$validators.userNameOk = function(username) {
        return username && username.indexOf('.') < 0;
      };
  }

http://plnkr.co/edit/Yd8C8Ut9VWPXEvDEMjFJ?p=preview

AngularJs用户验证请求每个字符

1 个答案: