Question

我刚刚阅读了很棒的angular page on form validation而且我可能错过了一些内容，但我如何在特定验证器上应用ng-model-options debounce属性。

让我解释一下这个问题。我有一个验证公钥的表单，为此我有一个名为key-check的指令，其中包含多个验证器。其中一些是本地的和同步的，如密钥的格式，还有另一个异步，检查服务器上的密钥是否可用（异步）。

我不想让我的服务器充满洪水，也不想让角度应用程序变慢，所以我使用那些酷孩子们调用debouncing，我的输入看起来像是：

<input type="text" ... ng-model="key" key-check ng-model-options="{ debounce: 700 }" ng-minlength="5" ng-maxlength="50"/>

指令就像：

ctrl.$validators.keyFormatCheck = function(modelValue) {
   // return boolean
}

ctrl.$asyncValidators.KeyAvailabilityCheck = function(modelValue) {
   // return promise
}

它的工作就像一个魅力，但所有的检查都是以700毫秒的延迟完成的，我想知道是否可以在不进行去抖动的情况下执行keyFormatCheck，并且可以使用KeyAvailabilityCheck。我可以使用旧的好方法$ timeout但我更喜欢这样做角度方式。

有什么想法吗？

Answer 1

ngModelController的{{1}}适用于解析器，验证器和视图更改侦听器的整个管道（例如debounce）。

今天（Angular v1.4）无法将ng-change隔离ngModelOptions延迟与特定验证器隔离。

但是通过将延迟参数传递给您自己的异步验证器指令可以轻松实现该功能：

debounce

您使用<input ng-model="val" foo-validator="{delay: 500}">实施实际延迟;这里没有理由避免使用$timeout，因为它在某种程度上不如“Angular方式”;不是。

唯一的技巧是确保在执行新的请求之前取消之前的待处理验证请求。

$timeout

var pendingValidation; ngModel.$asyncValidators.foo = function(modelValue, viewValue){ if (pendingValidation) $timeout.cancel(pendingValidation); pendingValidation = $timeout(function(){ pendingValidation = null; // returns promise or value return doAsyncValidation(); }, delay); return pendingValidation; };可以通过delay属性从参数中获取，可以使用隔离范围绑定（foo-validator），也可以直接使用scope: {config: "=fooValidator"} - 属性表达式在正确的范围内：

$eval

只对一个验证器进行辩解

1 个答案: