使用ng-messages为不同表单域显示多条消息

Question

是否可以使用角度为1.3的ng消息并在顶部显示验证摘要，并显示不同字段的错误消息？

<div ng-messages="myForm.$error"> 
    <div ng-message="required">Need to show required error for field 1.</div> 
    <div ng-message="required">Need to show required error for field 2.</div> 
</div> 

我该如何做到这一点？ 到目前为止，我所看到的所有例子都显示了单个字段的错误消息，而不是表单中的所有字段。

我是否需要为每个字段设置多个ng-messages部分？

Answer 1

我想样式全汇总块为一体。所以我最终这样做了。

<div class="error-summary" ng-show="myForm.$submitted && myForm.$invalid"> 
    <p ng-show="myForm.field1.$error.required">Field 1 is required.</p> 
    <p ng-show="myForm.field2.$error.required">Field 2 is required.</p> 
</div> 

我希望能用ng-messages做类似的事情。

Answer 2

这个怎么样？

<div ng-messages="myForm.field1.$error"> 
    <div ng-message="required">Need to show required error for field 1</div> 
</div> 
<div ng-messages="myForm.field2.$error"> 
    <div ng-message="required">Need to show required error for field 2</div> 
</div> 
<div ng-messages="myForm.field3.$error"> 
    <div ng-message="required">Need to show required error for field 3</div> 
</div> 

Answer 3

是的，你应该有多个ng-messages。请看下面的链接。

http://plnkr.co/edit/QgNkXKosgcArGZW7WuZO?p=preview

<form name="myForm"> 
    <label>Enter your name:</label> 
    <br> 
    <input type="text" name="myName1" ng-model="name1" required /> 
    <br> 
    <input type="text" name="myName2" ng-model="name2" required /> 

    <div ng-messages="myForm.myName1.$error"> 
    <div ng-message="required">enter name 1</div> 
    </div> 
    <div ng-messages="myForm.myName2.$error"> 
    <div ng-message="required">enter name 2</div> 
    </div> 
</form>