Как должна быть формальная функция проверки достоверности сообщений об ошибках?

Question

У меня есть асинхронная формальная функция проверки поля, которая используется в нескольких формах и проверяет несколько аспектов поля. Я хотел бы иметь возможность «возвращать» (в общем смысле) текст ошибки из функции проверки поля, которая точно определяет, что не так с полем.

Каков наилучший способ сделать это? Я бы предположил, что хочу выпустить текст в область видимости, но я не знаю, где. Я прорыл все примеры (я думаю) и не вижу ничего родственного.

Answer 1

Я делаю это с помощью комбинации formlyValidationMessages и fieldWrapper. Первоначальная конфигурация довольно сложная, но приводит к довольно гибкой системе проверки, которая позволяет обрабатывать синхронные и асинхронные ошибки проверки одинаково. Большая часть этой почты была вымощена букетом от официального async Validation example.

formlyValidationMessages позволяет настроить некоторые сообщения об ошибках по умолчанию для типичных ошибок проверки. Вот пример я использую в своих проектах

angular.module('myModule', ['formly']).run(formlyValidationMessages){ 
    formlyValidationMessages.messages.required = 'to.label + " is required"' 
    formlyValidationMessages.messages.max = '"The max value allowed is " + to.max' 
    formlyValidationMessages.messages.min = '"The min value allowed is " + to.min'   
} 

Это Formly Expressions так что они могут быть строками или функции.

Это в основном устанавливает часы на свойство ошибки полей в угловой форме. Если это ошибка в форме для поля (например, form.field.$error.required === true), она добавит max к validation.messages в ваш объект конфигурации поля.

Если вам нужна конкретная ошибка для определенного поля, вы можете добавить ее в определение поля. например

var field = { 
    key: 'serialNumber', 
    type: 'input' 
    .... 
    validation: { 
     messages: { 
     unique: function() { 
      return 'Serial number 123 is not unique' 
     } 
     } 
    } 
    asyncValidators: { 
     unique: { 
      expression: function(modelValue, viewValue, scope) { 
      return $timeout(
       function(){ 
       if(modelValue === '123') { 
        throw 'unique failure: 123' //throw to reject promise 
       } 
       }, 
       1000 
      ) 
      } 
     } 
    } 
} 

Для отображения этого пользователя, создать hasError оболочку для ваших полей, которые используют ngMessages для создания каждого поля списка ошибок для ваших полей.

module.config(function(formlyConfigProvider) { 
    formlyConfigProvider.setWrapper({ 
    name: 'hasError', 
    template: '<div class="form-group" ng-class="{\'has-error\': showError}">' + 
     ' <label class="control-label" for="{{id}}">{{to.label}}</label>' + 
     ' <formly-transclude></formly-transclude>' + 
     ' <div ng-messages="fc.$error" ng-if="showError" class="text-danger">' + 
     ' <div ng-message="{{ ::name }}" ng-repeat="(name, message) in ::options.validation.messages" class="message">{{ message(fc.$viewValue)}}</div>' + 
     ' </div>' + 
     '</div>' 
    }) 
}) 

Here is a plunker, что имеет функционирующий пример с использованием начальной загрузки укладки. Если вы введете 123, вы получите асинхронную ошибку проверки, но если вы оставите ее пустой, вы получите синхронную.

Answer 2

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

Как в этом примере: https://docs.angularjs.org/guide/forms

Вы создаете вашу директиву с проверкой на уникальность и проверить, если директива срабатывает и использовать ng-show только показать его, когда его необходимо.

<span ng-show="form.name.$error.username">This username is already taken!</span>