Угловая проверка поля триггера после загрузки формы

Question

У меня есть набор полей данных. Они выглядят так:

// Read-Only 
<div class="field-group" ng-if="feature.edit == false"> 
    <div class="label" ng-class="{'feature-required': field.Validations.Required === true}">{{field.Label}}</div> 
    <div class="value">{{field.Value}}</div> 
</div> 


// Editor 
<div class="field-group" ng-show="feature.edit == true"> 
    <label for="F{{field.FieldID}}"> 
     <span ng-class="{'feature-required': field.Validations.Required === true, 'feature-notrequired': field.Validations.Required === false}">{{field.Label}}</span> 

     <input type="text" 
       id="F{{field.FieldID}}" 
       name="F{{field.FieldID}}" 
       ng-change="onFieldUpdate()" 
       ng-model="field.Value" 
       jd-field-attributes attr-field="field" 
       jd-validate on-error="onFieldError" 
       field="field"> 
    </label> 

</div> 

feature.edit управляется с помощью кнопки, и вы можете иметь считывания данных Olny или редактирования. Каждое поле имеет некоторую проверку, обычно, если требуется, оно должно отличаться от нуля. Я хочу вызвать эту проверку после того, как я нажму кнопку «Изменить», и появятся поля ввода. Один из способов сделать это - пропустить все поля ввода и использовать jQuery trigger ("change"). Я должен сделать это с некоторой задержкой (для заполнения всех полей требуется Angular). Есть ли способ вызвать ng-change или запустить onFieldUpdate(), после чего вход становится видимым? Я пробовал ng-init, но это не сработало.

Answer 1

Вы можете перенести логику проверки на пользовательские валидаторы в конвейер ngModel $validators. Функции, которые вы добавляете в этот конвейер, будут оцениваться с учетом значения входной модели каждый раз, когда она будет изменяться, и автоматически добавлять связанные входные/допустимые классы.

Вот пример того, как можно добавить пользовательские валидатор:

app.directive('moreValidation', function() { 
    return { 
    restrict: 'A', 
    require: 'ngModel', 
    link: function(scope, element, attributes, ngModel) { 
     ngModel.$validators.first = function(input) { 
     return true; // add your custom logic here 
     } 

     ngModel.$validators.second = function(input) { 
     return true; 
     } 

     ngModel.$validators.third = function(input) { 
     return true; 
     } 
    } 
    }; 
}); 

// markup 
<input type="text" ng-model="modelObject" more-validation /> 

Вот небольшие рабочий plnkr например: http://plnkr.co/edit/mKKuhNqcnGXQ4sMePrym?p=preview