Question

我目前正在使用ngMessages来控制表单上的消息显示。这是一个例子：

<div ng-messages="ahs.forms.modal.modalUserEmail.$error">
   <div ng-message="required">
      Email is required ...
   </div>
   <div ng-message="email">
      Email is not valid ...
   </div>
</div>

<div class="w50p">
   <span class="label">Email</span>
   <input id="modalUserEmail"
      ng-disabled="ahs.modal.disable"
      ng-model="ahs.modal.data.email"
      ng-required="true"
      name="modalUserEmail"
      type="email" />
</div>

我想要做的是更改此设置，以便在需要电子邮件或电子邮件无效的情况下，使用星号内的电子邮件标题右侧的 <星级。我希望星号有一个标题，当它悬停时显示相应的信息：

我知道我可以这样做：

<span ng-show="home.forms.modal.modalUserEmail.$error.required">Required</span>
<span ng-show="home.forms.modal.modalUserEmail.$error.email">Invalid Email</span>

但是我如何将其纳入标题信息？

<span class="label">Email</span>
<span ng-show="ahs.forms.modal.modalUserEmail.$error"
      title=
>*</span>

我坚持如何实现此代码的第3行，并感谢任何帮助/建议。我想可能的答案可能是

ng-attr-title or
ng-attr-title="{{ home.forms.modal.modalUserEmail.$error.required ? '*' : '' }}"

但是我无法解决如何使用它并让它根据modalUserEmail的值动态更改ng-attr-title的值。$ error和一个或多个可能的其他错误但一次只有一条错误消息。因此，它将显示＆＃34;必需＆＃34;或＆＃34;无效的电子邮件＆＃34;但不能同时将错误消息作为标题。

Answer 1

如果我正确理解了这个问题，我会在指令中使用OR表达式。像这样：

<span ng-attr-title="{{home.forms.modal.modalUserEmail.$error.required ||
    home.forms.modal.modalUserEmail.$error.someOtherError ||
    home.forms.modal.modalUserEmail.$error.aThirdError}}"
>*</span>

上面的代码会尝试将标题设置为$ error.required或$ error.someOtherError或$ error.aThirdError。如果设置了多个，它将使用表达式中的第一个。如果没有定义，则根本不会设置任何内容。

如何使用AngularJS将字段属性设置为错误消息的字段显示星号？

1 个答案: