Angular ngMessages在有效时更改类,而不仅仅在出错时更改类

时间:2022-01-27 20:49:29

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.

这是我第一次使用ngMessages,我的问题是$ error对象是否有对应的东西,比如$ valid?在ngMessages的角度文档中,我只遇到了$ error对象。

<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.

我所知道的是当$ error对象为false时我将类更改为'valid-field'但这不正确。这样输入字段的格式就像它始终有效并且不应该发生。

1 个解决方案

#1


2  

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 :)

基于ng-model的文档,$ error来自哪里,它也有一个$ valid状态所以回答你的问题,是的,它确实:)

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.

$ valid:boolean:如果没有错误,则为True。

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.

ng-model属性应该与每个字段一起使用,但是在您的示例中,输入没有ng-model,这也可能是问题的根源。

#1


2  

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 :)

基于ng-model的文档,$ error来自哪里,它也有一个$ valid状态所以回答你的问题,是的,它确实:)

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.

$ valid:boolean:如果没有错误,则为True。

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.

ng-model属性应该与每个字段一起使用,但是在您的示例中,输入没有ng-model,这也可能是问题的根源。