6

Я только что прочитал потрясающий angular page on form validation, и я, вероятно, что-то пропустил, но как я могу применить свойство на конкретном валидаторе.Откажитесь только от одного валидатора

Позвольте мне объяснить проблему. У меня есть форма, которая проверяет открытый ключ, и для этого у меня есть директива с именем key-check, которая содержит несколько валидаторов. Некоторые из них являются локальными и синхронными, как формат ключа, и существует еще одна асинхронная проверка того, доступен ли ключ на сервере (асинхронно).

Я не хочу, чтобы мой сервер был потоп, ни угловое приложение, чтобы быть замедлен, поэтому я использую, что прохладно дети называют дребезга и мой вклад, кажется, что-то вроде:

<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, но я предпочитаю делать это угловой способ.

Любые идеи?

+0

You всегда может передать параметр вашей директиве –

+0

Проблема не в том, что я не могу добавить свойство в свою директиву. Проблема в том, что внутри директивы, как я могу установить debounce на валидаторе? –

+0

Затем вы добавляете $ timeout соответственно –

ответ

5

ngModelControllerdebounce распространяется на весь конвейер парсеров, валидаторов и прослушивателей смены вида (например, ng-change).

Сегодня нет способа (Angular v1.4) с ngModelOptions, чтобы выделить задержку debounce для определенного валидатора.

Но функциональность легко достигается путем передачи параметра задержки в вашей собственной директиве асинхронной валидатора:

<input ng-model="val" foo-validator="{delay: 500}"> 

Вы осуществить фактическую задержку с $timeout; нет причин, чтобы избежать использования $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 -ный выражения атрибута против правой рамки:

var config = $scope.$eval(attrs.fooValidator); 
var delay = config.delay; 
+1

Хорошо, поэтому нет возможности напрямую применить свойство debounce к валидатору, а не всему конвейеру. Я думаю, это хороший ответ, даже если он не удовлетворяет вообще: '( Спасибо в любом случае. –

+0

@ThomasLeduc, справа - нет никакого способа. Будет ли это удовлетворительно или нет, вы можете взять его с командой Angular и предложить улучшение, но, на мой взгляд, это будет слишком узким прецедентом для реализации для рамки –

+0

Возможно, вы правы ... но это не так уж и узко, это основной случай. Спасибо за подтверждение в любом случае. –

Смежные вопросы