如何为AngularJS Forms编写通用错误处理程序

时间:2012-09-19 21:38:33

标签: javascript forms validation angularjs

这是这个问题的后续问题:

Server-side validation form Angular.js

因此,使用该答案,您可以在模板中编写一些HTML,这些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>

这可能吗?

1 个答案:

答案 0 :(得分:4)

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

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

如果您需要更具体,可以使用ng-repeat进行迭代 myProfile.lastName.$error对象并显示所有错误。 在这种情况下,您必须为错误消息转换提供一些错误名称 可读性。