4

angular 1.3でng-messagesを使用し、さまざまなフィールドのエラーメッセージとともに検証の概要を上部に表示することは可能ですか?

<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>

どうすればこれを達成できますか? これまでに見たすべての例は、フォーム内のすべてのフィールドではなく、1 つのフィールドのエラー メッセージを表示しています。

各フィールドに複数の ng-messages セクションが必要ですか?

4

3 に答える 3

6

要約ブロック全体を 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 を使用して、これと同様のことをしたいと思っていました。

于 2015-04-03T13:54:06.070 に答える
3

これはどう？

<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>
于 2015-04-03T04:47:39.207 に答える
1

はい、複数ある必要があります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>
于 2015-04-03T04:55:47.840 に答える