javascript - 如何为 AngularJS 表单编写通用错误处理程序

Question

这是此问题的后续问题:

Server-side validation form Angular.js

因此，使用该答案，您可以在模板中编写一些 HTML，该模板将为您给出的每个错误显示特定的错误 $setValidity。例如，这是一个:

<input ng-model="user.lastName" required="true" id="lastNameField" name="lastName" type="text" class="span3" placeholder="Last Name"/>
<span class="inlineError" ng-show="myProfile.lastName.$error.required">Required</span>

但是，如果我想为姓氏添加一个长度必须为 4 个或更多字符的字符，我需要:

<input ng-model="user.lastName" required="true" id="lastNameField" name="lastName" type="text" class="span3" placeholder="Last Name"/>
<span class="inlineError" ng-show="myProfile.lastName.$error.minRequired">Last name must be at least 4 characters long</span>

我的问题是如何为字段上的所有错误编写通用处理程序。像这样的东西:

<input ng-model="user.lastName" required="true" id="lastNameField" name="lastName" type="text" class="span3" placeholder="Last Name"/>
<span class="inlineError" ng-show="myProfile.lastName.$error.required">{{myProfile.lastName.$error.required}}</span>

这可能吗？

Answer 1

你的意思是你只是想表明表单元素的有效性吗？ 然后，你可以这样做:

<span ng-show="myProfile.lastName.$invalid">Input field is invalid.</span>

如果需要更具体，可以使用ng-repeat来迭代 myProfile.lastName.$error 对象并显示所有错误。 在这种情况下，您必须有一些错误名称到错误消息的翻译 可读性。