我有一个Angular表单（称为saveForm），它有一堆文本输入，用于绑定到名为billingAddress的变量。每个输入看起来像这样：
<div class="col-md-4 col-sm-4">
<div class="editor-label">
<label for="billName">Name*</label>
</div>
<div>
<input type="text" class="form-control" title="{{billingAddress.name}}"
id="billName" name="billName" ng-model="billingAddress.name" required />
<span class="field-validation-error"
ng-show="saveForm['billName'].$error.required">
{{saveForm['billName'].$error.message}}
</span>
</div>
</div>
显然，我还有更多输入（每个输入都有不同的名称，如name="billAddress1"或name="billCity"）。这些都在UI Bootstrap <accordion>中。在<accordion-heading>中，如果与帐单邮寄地址相关的任何表单验证失败，我想显示一条消息。但我有很多输入，我想避免这个目前膨胀的解决方案：
<accordion-heading>
Billing Address
<i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': billingAccordionObj.open
, 'glyphicon-chevron-right': !billingAccordionObj.open}">
</i>
<span class="field-validation-error" ng-show="saveForm['billName'].$error.required
|| saveForm['billAddress1'].$error.required
|| saveForm['billCity'].$error.required"
... all the other fields>
Invalid Billing Address
</span>
</accordion-heading>
是否有更优雅的方法可以针对与我的billingAddress对象关联的任何错误显示此摘要？或者我难以输入输入字段的所有名称？
答案 0 :(得分：2)
使用表单并使用表单验证的$error属性而不是每个单个输入字段的验证：
<form name="MyForm">
<input name="name" ng-model="m.name" required>
<input type="number" min="1" name="age" ng-model="m.age" required>
</form>
如果您只获得了required验证的输入字段，而无法进行其他验证：
<span ng-show="MyForm.$error.required.length">Invalid</span>
如果存在其他验证或您想要一个imo clean解决方案，请定义一个过滤器以检查表单是否有效：
app.filter('isInvalid', function() {
return function(form) {
return Object.keys(form.$error).length;
}
})
<span ng-show="MyForm | isInvalid">Invalid</span>
Plunker：http://plnkr.co/edit/h63atRf4m4qcFxnlD5JN?p=preview
修改
如果您只想在特定字段无效时显示验证消息，则只能执行以下操作：
app.filter('validateFields', function() {
return function(form, fields) {
for(var i = 0; i < fields.length; i++) {
if(form[fields[i]].$invalid) {
return false;
}
}
return true;
}
})
<div ng-show="!(MyForm | validateFields : ['street', 'city'])">Invalid</div>