2016-01-19 2 views
1

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

Рассмотрим следующий код:

<ul ng-messages="formToValidate.fieldToValidate.$error" ng-messages-multiple> 
    <li ng-message="pattern">Invalid pattern</li> 
    <li ng-message="minlength, maxlength">Should contain no less than 7 and no more than 100 chars</li> 
    <li ng-message="!pattern && !minlength && !maxlength && onlyAfterAllOtherPassedValidation"> 
     This validation message is shown only when all the other validations have passed and validation fails on onlyAfterAllOtherPassedValidation 
    </li> 
</ul> 

Я хочу, чтобы показать сообщение последней проверки только если все другие проверки прошли, и проверка не выполняется только после AfterAllPotherPassedValidation. И я не знаю, можно ли вообще пройти комплексное условие нг-сообщение Любые предложения, а также обходные приветствуются до тех пор, как я по-прежнему можно использовать нг-сообщения

ответ

3

Вы можете использовать нг-если на элемент, удерживающий сообщение, например

<li ng-if="!formToValidate.fieldToValidate.$error.required && !formToValidate.fieldToValidate.$error.minLength && !formToValidate.fieldToValidate.$error.maxLength" ng-message="onlyAfterAllOtherPassedValidation"> 
    This validation message is shown only when all the other validations have passed and validation fails on onlyAfterAllOtherPassedValidation 
</li> 
+0

Работы для меня, не думал даже об этом! благодаря –

0

решение, предложенное JonMac1374 курсовой работы. Но лучше решить эту проблему раз и навсегда. Советую обратить внимание на директиву use-form-error. Это помогает создать собственную проверку.

Живой пример на jsfiddle.

<form name="ExampleForm"> 
    <label>Password</label> 
    <input ng-model="password" name="password" minlength="2" pattern="^\d*$" required use-form-error="onlyAfterAllOtherPassedValidation" use-error-expression="!ExampleForm.password.$error.required && !ExampleForm.password.$error.minlength && !ExampleForm.password.$error.pattern" 
    /> 
    <pre>{{ExampleForm.password.$error|json}}</pre> 
    <div ng-messages="ExampleForm.password.$error" ng-messages-multiple="true" class="errors"> 
    <div ng-message="required"> 
     Your required is wrong 
    </div> 
    <div ng-message="pattern"> 
     Your pattern is wrong 
    </div> 
    <div ng-message="minlength"> 
     Your minlength is wrong 
    </div> 
    <div ng-message="onlyAfterAllOtherPassedValidation"> 
     Your onlyAfterAllOtherPassedValidation 
    </div> 
    </div> 
</form> 
Смежные вопросы