Angular ng-show 未使用 ng-message 标签执行

Question

不知道我在这里做错了什么。 我想在用户提交表单后显示一条 ng 消息。但是，当表单呈现时，该消息会显示出来。似乎ng-show没有评估。

我在表达式中打印了字段，打开表单时它是错误的。另外，我将其更改为ng-hide，但我有同样的问题。

你能不能看看..

<div class="small-12">
<label>first name
<span class="field-error"> *</span>
</label>
<input name="firstName" 
type="text" 
maxlength="25" 
ng-disabled="isSubmitting" required 
ng-model="candidate.firstName" 
ng-class="{error:isFormSubmitted && contactForm.firstName.$error.required}" />
<div ng-messages="forms.contactForm.firstName.$error" 
class="errorFormLabel" role='alert'>
<div ng-message="required" 
ng-show="isFormSubmitted">This is a required field {{isFormSubmitted}}
</div>
</div>
</div>

Answer 1

将ng-messages视为switch子句，您可以将/ng-show/ng-hide嵌套在指令ng-message但不能将它们一起使用

例如：

<div ng-messages="forms.contactForm.firstName.$error" 
class="errorFormLabel" role='alert'>
<div ng-message="required">
<span ng-show="isFormSubmitted">This is a required field {{isFormSubmitted}}</span>
</div>
</div>
</div>

如果你不想要一个额外的元素：<span>，试试ng-if，基本上ng-if的优先级高于任何其他 angularjs 指令，如果表达式不是正数，它将强制从 DOM 树中删除ng-message指令。

<div ng-message="required" 
ng-if="isFormSubmitted">This is a required field {{isFormSubmitted}}
</div>