Как проверить шаблон на основе формы внутри таблицы с различными полями? - PullRequest
Новая
       13

Как проверить шаблон на основе формы внутри таблицы с различными полями?

0 голосов
/ 02 мая 2018

В моем ионно-угловом приложении я использую управляемые шаблоном формы. Когда я отправляю форму, не касаясь полей ввода, она должна отображать сообщение об ошибке, но в этом случае я не могу отобразить сообщение об ошибке в диапазоне.

Вы можете видеть комментарии, в которых написано сообщение об ошибке. Как мне проверить эту форму?

page.html 

  <form (ngSubmit)="submitForm()" #form="ngForm">
    <table>
    <tr>
    <td>
    <ion-input type="text" #c1 [(ngModel)]="c" name="c" required>
    </td>

    <td>
    <ion-input type="text" #c2 [(ngModel)]="d" name="d" required>
    </td>
    </tr>
    </table>

    <span *ngIf="c1.pristine && c2.pristine && form.submitted">Plese enter codes</span> //error-message is not printing.

    <button type="submit">Submit</button>
    </form>

1 Ответ

0 голосов
/ 02 мая 2018

Попробуйте код ниже. 

<form (ngSubmit)="submitForm()" #form="ngForm" novalidate>
<table>
<tr>
  <td>
    <ion-input type="text" [(ngModel)]="c" name="c" id="c1" #c1="ngModel" required>
    <div [hidden]="!(c1.invalid && c1.touched)">Invalid.</div>
  </td>
  <td>
    <ion-input type="text" [(ngModel)]="d" name="d" id="c2" #c1="ngModel" required>
    <div [hidden]="!(c2.invalid && c2.touched)">Invalid.</div>
  </td>
</tr></table><button type="submit" [disabled]="!form.form.valid">Submit</button></form>
...