CODEWITHSUNDEEP
cssangularjsformsvalidation
AC3
AC3

Reputation: 355

Angular ngMessages change class when valid and not only on error

It's my first time working with ngMessages and my question is if the $error object has a counterpart, something like $valid? In the angular documentation for ngMessages I only came across the $error object.

<form name="contactForm">

    <input ng-class="{'invalid-field': contactForm.nameField.$error, 'valid-field': !contactForm.nameField.$error}" type="text" name="nameField" placeholder="Full name*" required>

    <div ng-messages="contactForm.nameField.$error">
        <div ng-message="required">Name is required</div>
    </div>

</form>

What I'm doing know is when the $error object is false I change the class to 'valid-field' but this isn't correct. This way the input field is formatted like it's always valid and that isn't supposed to be happening.

Upvotes: 1

Views: 1115

Answers (1)

GillesC
GillesC

Reputation: 10874

Based on the documentation the ng-model, where the $error comes from, it also have a $valid state so to answer your question, yes it does :)

Documentation will also show you other validation related angular model states.

https://docs.angularjs.org/api/ng/type/ngModel.NgModelController

$valid: boolean: True if there is no error.

ng-model attribute should be use with each field though when here in your example the input does not have a ng-model which could also be source of problem.

Upvotes: 2

Related Questions