AngularJS - カスタムディレクティブを挿入すると、フォームが無効に変更されました

Question

カスタムディレクティブを使用して非同期検証を実装しようとしています。

あなたはルートユーザ名が入力されたときに、このユーザ名であるため、戻りはJSONオブジェクトで見ることができるようにこれは、コンソール

でディレクティブ

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; 
        } 
       ); 
      }; 
     } 
    }; 
}); 

結果であり、使用中。

しかし、HTMLには、directive unique-nameが挿入されたときの$が無効です。

Attribute name "data-unique-name" associated with an element type "input" must be followed by the ' = ' character.

あなたは何を：私がない場合、次のエラーが発生しthymeleafので

<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> 

私は、データ固有名=「」（=「」）を使用しています考えて間違っていると思いますか？

Answer 1

nombreuniqueNameを確認しています。このため、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; 
} 
       ); 
      }; 
     } 
    }; 
});