时间戳

首页 > 解决方案 > Angular ng-show 未使用 ng-message 标签执行

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

问题描述

不知道我在这里做错了什么。我想在用户提交表单后显示一条 ng-message。但是，在呈现表单时会显示该消息。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>

标签： angularjsng-messages

解决方案

将ng-messages其视为一个switch子句，您可以将ng-show// ng-hideinsideng-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>， try ng-if，基本上ng-if优先级高于任何其他 angularjs 指令，ng-message如果表达式不是正数，它将强制从 DOM 树中删除指令。

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

推荐阅读