Javascript AngularJS-插入自定义指令时表单更改为无效

我试图通过使用自定义指令实现异步验证

这是指令

moduloArea.directive('uniqueName', function($http, $q) {
    return {
        require : 'ngModel',
        link: function($scope, element, attrs, ngModel) {
            ngModel.$asyncValidators.nombre = function(modelValue, viewValue) {
                return $http.get('/checkUsernameAvailability/'+viewValue).then(
                    function(response) {
                        if (!response.data.validUsername) {
                            return $q.reject(response.data.errorMessage);
                        }
                        return true;
                    }
                );
            };
        }
    }; 
});

控制台中的结果

正如您所看到的，当输入根用户名时，返回是一个JSON对象，因为这个用户名已经被使用了

但在HTML中，插入指令唯一名称时，$中的表单无效

<form name="registerUsernameForm" novalidate="novalidate">
    <input type="text" name="username" data-ng-model="person.userName" data-unique-name="" required="required"/>
    <span data-ng-show="registerUsernameForm.username.$error.uniqueName">This username is already taken.</span>        
    <button type="submit" data-ng-disabled="registerUsernameForm.$invalid || registerUsernameForm.$pending" data-ng-click="registerPerson(person)"> Save Person </button>
</form>

此用户名已被使用。
救人

我使用的是数据唯一名称=“”（=”），因为如果我不这样做，thymeleaf将生成以下错误：

与元素类型关联的属性名称“数据唯一名称” “input”后面必须跟“=”字符

---

你认为什么是错误的？

你正在验证名称而不是唯一名称。因此，uniqueName仍然无效

 moduloArea.directive('uniqueName', function($http, $q) {
    return {
        require : 'ngModel',
        link: function($scope, element, attrs, ngModel) {
            ngModel.$asyncValidators.uniqueName= function(modelValue, viewValue) {
                 var value = modelValue || viewValue;
                return $http.get('/checkUsernameAvailability/'+value ).then(
                    function resolved(response) {
                        if (response.data && !response.data.validUsername) {
                            return $q.reject(response.data.errorMessage);
                        }
                        return true;
                    }, function rejected() {
                      //username does not exist, therefore this validation passes
                      return true;
 }
                );
            };
        }
    }; 
});

---

谢谢，老兄，你能像我8岁一样给我解释一下这个指令吗。我真的对此一无所知，从“函数解析（响应）”开始我就迷失了方向。解析只是清除代码的一个名称。你可以设置你想要的$http承诺基本上有2个回调。第一个是成功，第二个是错误。当RESTAPI返回2XX状态时，这意味着它成功了。4XX是客户端错误，5XX是服务器错误。也就是说，如果名称不存在，您可以抛出一个错误。这意味着验证成功。