2017-02-17 4 views
1

Я использую следующий код для проверки правильности , минимальной длины и максимальной длины, что дает все три сообщения. Не могли бы вы рассказать, как управлять на основе ввода пользователем.Вопрос о валидации сообщения в AngularJS

<form name="Textvaluepair" novalidate> 
    <h4>New Network</h4>  

    <div class="form-group" ng-class="{ 'has-error': Textvaluepair.name.$touched && Textvaluepair.name.$invalid }"> 
     <label>Name</label> 
     <input type="text" name="name" class="form-control" 
     ng-model="networkModel.name" 
     ng-minlength="5" 
     ng-maxlength="10" 
     required> 

     <div class="help-block" ng-messages="Textvaluepair.name.$error" ng-if="Textvaluepair.name.$touched"> 
     <p ng-message="minlength">Your name is too short.</p> 
     <p ng-message="maxlength">Your name is too long.</p> 
     <p ng-message="required">Your name is required.</p> 
     </div> 
    </div> 
    <div class="form-group"> 
     <button type="submit" ng-click="Submit()">Submit</button> 
    </div> 
</form> 

enter image description here

ответ

2

Пожалуйста, попробуйте использовать этот код

<span ng-show="Textvaluepair.name.$error.required" class="help-block">Required</span> 
<span ng-show="Textvaluepair.name.$error.minlength" class="help-block">Min Length</span> 
<span ng-show="Textvaluepair.name.$error.maxlength" class="help-block">Max Length</span> 
1

изменить код, как этот

<div class="help-block" ng-repeat="(key, value) in Textvaluepair.name.$error" ng-if="Textvaluepair.name.$touched"> 
    <p ng-if="key == 'minlength'">Your name is too short.</p> 
    <p ng-if="key == 'maxlength'">Your name is too long.</p> 
    <p ng-if="key == 'required'">Your name is required.</p> 
</div> 
Смежные вопросы