如何使表单提交等待验证完成角js

Question

我有一个简单的表单，我必须验证ajax调用上的许多输入字段。

许多输入字段都是可重用的，所以我使用了它们的指令。

<input name="UserName" 
     type="text" 
     user-name-unique 
     ng-model="UserName" 
     required 
/> 

指令功能：

elem.on('blur', function(evt) { 
    scope.$apply(function() { 
    var data = { 'username': elem.val() }; 
    var ajaxConfiguration = { method: 'POST', url: 'url', data: data }; 
    async(ajaxConfiguration).success(function(data, status, headers, config) { 
     ctrl.$setValidity('userNameUnique', !data.IsSuccess); 
    }); 
    }); 
}); 

同样我有许多指令这验证使用AJAX调用的输入。

如何让我的提交功能等待我的所有ajax请求完成？

Answer 1

创建指令，你的提交按钮可以跟踪，然后就打你的提交按钮，将只有一次您的自定义指令字段更新disabled指令被评估为true：

<input name="UserName" 
     type="text" 
     user-name-unique 
     ng-model="UserName" 
     required 
     validate="process()" //retun true/false, processed whenever value changes 
/> 


<form> 
    <button type="submit" disabled>Submit</button> 
</form> 

然后创建一个监听器当输入更新，并检查它的验证状态