Angular.js ngMessages有效时显示消息

Question

从这里开始> Angular ngMessages change class when valid and not only on error

我试过了

<div ng-messages="userForm.name">
    <i ng-message="$error.required" class="fa fa-exclamation-circle"></i>
    <i ng-message="$valid" class="fa fa-exclamation-check"></i>
</div>

这

<div ng-messages="userForm.name.$error">
    <i ng-message="required" class="fa fa-exclamation-circle"></i>
    <i ng-message="$valid" class="fa fa-exclamation-check"></i>
</div>

还有这个

<div ng-messages="userForm.name.$error">
    <i ng-message="$error" class="fa fa-exclamation-circle"></i>
    <i ng-message="userForm.name.$valid" class="fa fa-exclamation-check"></i>
</div>

还有一些我不会费心列出的。他们都不起作用。请给我一个工作示例。

Answer 1

ngMessages正在检查特定类型的列表，例如，如果存在$error，那么它将检查错误类型的列表，如所需的、最小长度、最大长度等。

在您的示例中，您正在尝试使用$valid In $error。它不可能发生，因为如果它是有效的，那么它就不会有一个错误。

我认为您可以简单地使用ng-show属性来显示这样的消息

<div ng-show='myForm.myName.$error.required'>required</div>
<div ng-show='myForm.myName.$valid'>valid</div>

或者在你的情况下

<i ng-show='myForm.myName.$error.required' class='fa fa-exclamation-circle'></i>
<i ng-show='myForm.myName.$valid' class='fa fa-exclamation-check'></i>

参见下面的示例http://plnkr.co/edit/z1Lrz17z9qnViq9HAahg?p=preview