如何使用AngularJS基于复杂表达式设置HTML元素的标题？

Question

我知道{{}}但是如何根据三个不同变量的值设置元素的标题：

我想要一条消息说：

"Required field" if !forms.register.userName.$dirty && forms.register.submitted

"Already taken" if forms.register.userName.$dirty && forms.register.userName.$error.uniqueName

我可以将{{}}放入if else或switch之类的内容，还是有其他方法可以做到这一点？

Answer 1

您似乎正在尝试设置表单验证。这是一本很棒的教程，可能包含您正在寻找的内容：

https://scotch.io/tutorials/angularjs-form-validation#showing-an-error-message-ng-show

在您的情况下，消息看起来像这样：

<p ng-show="!forms.register.userName.$dirty && forms.register.submitted" class="help-block">Required field</p>
<p ng-show="forms.register.userName.$dirty && forms.register.userName.$error.uniqueName" class="help-block">Already taken</p>

如果您尝试根据这些表达式实际设置HTML元素的title属性，请告诉我，我可以更新答案。您正在寻找生成的静态HTML示例也会有所帮助。

Answer 2

您可以执行以下操作：

<span ng-if="!forms.register.userName.$dirty && forms.register.submitted">{{variable}}</span>
<span ng-if="forms.register.userName.$dirty && forms.register.userName.$error.uniqueName">{{variable}}</span>