javascript - AngularJS NgMessages 不隐藏消息

Question

我是 AngularJS 的新手，所以这可能是一个非常愚蠢的问题。

通过使用 Angular documentation on ngMessages ，我想实现在满足特定要求时显示的消息框。

但是，即使使用复制粘贴的例子，即使不满足要求，消息框也不会被隐藏。不过，$error 变量确实显示了正确的值。

angular.module('ngMessagesExample', ['ngMessages']);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.min.js"></script>
<form name="myForm">
    <label>
        Enter your name:
        <input type="text" name="myName" ng-model="name"  ng-minlength="5" ng-maxlength="20" required />
    </label>
    <pre>myForm.myName.$error = {{ myForm.myName.$error | json }}</pre>

    <ng-messages for="myForm.myName.$error" style="color:maroon;" role="alert">
        <ng-message when="required">You did not enter a field</ng-message>
        <ng-message when="minlength">Your field is too short</ng-message>
        <ng-message when="maxlength">Your field is too long</ng-message>
    </ng-messages>
</form>

这是它的样子:

Answer 1

这是您的问题的替代解决方案。

<p ng-if="myForm.myName.$error.minlength">Your field is too short.</p>   
<p ng-if="myForm.myName.$error.maxlength">Your field is too long.</p>   
<p ng-if="myForm.myName.$error.required">You did not enter a field.</p>