ぼかしの非同期検証ディレクティブJS

Question

私は、非同期Webリクエストによってユーザーから与えられたメールを検証するディレクティブを作成しようとしています。それはうまく動作しますが、問題は、非同期呼び出しがユーザーが文字を入力するたびに行われることです。私は非同期呼び出しがぼかしでのみ行われるようにしたいのですが、どうすればいいですか？ここで

は、ディレクティブのコードです：

angular.module('myModule').directive('usernameValidator', function($http, $q) { 
return { 
    require: 'ngModel', 
    link: function(scope, element, attrs, ngModel) { 
     ngModel.$asyncValidators.username = function(modelValue, viewValue) { 
      return $http.post('/username-check', {username: viewValue}).then(
       function(response) { 
        if (!response.data.validUsername) { 
         return $q.reject(response.data.errorMessage); 
        } 
        return true; 
       } 
      ); 
     }; 
    } 
}; 
}); 

私は圏で

element.bind('blur', function() { ... }) 

をすべてを置くことを試みた。しかし、コードがelement.bind圏内にあるとき、私は全く奇妙なを持っていますビヘイビア：初めて入力をフォーカスし、非同期呼び出しをぼかさない。非同期呼び出しをぼかすと、入力にフォーカスが戻ったときに、それぞれのキャラクタの非同期呼び出しがある。

Answer 1

はhttps://docs.angularjs.org/api/ng/directive/ngModelOptions#で実証されたようにHTML ng-model-options="{ updateOn: 'blur' }"であなたのディレクティブに追加しようとするので、あなたのディレクティブは次のようになります！

<input ng-model="your_model" 
     username-validator 
     ng-model-options="{ updateOn: 'blur' }">