Как добавить сообщение проверки для динамически добавленных полей в Angular - PullRequest
0 голосов
/ 01 октября 2019

У меня есть форма, которая динамически добавляет поля. Здесь я хочу проверить эти поля в форме отправки. Как добавить сообщение об ошибке, недопустимое в динамически генерируемых полях.

Шаблон:

<form [formGroup]="template" autocomplete="off" novalidate (ngSubmit)="onSubmit(template.value)">
    <li>
            <div class="section" formArrayName="vendor_email"
            *ngFor="let vmail of vendorEmailFormArray.controls; let i = index">
                    <input kendoTextBox autocomplete="new-password" formControlName="{{ i }}" />
            </div>
        <p>
            <button type="button" (click)="addEmail('vendor_email')" kendoButton look="flat" [icon]="'plus'">
            add
            </button>
        </p>
    </li>
    <button kendoButton [primary]="true" [disabled]="template.pristine">
    Update
    </button>
</form>

Контроллер:

addEmail (name) {
    let controls = this.template.get(name) as FormArray;
    controls.push(
        new FormControl('', [
            Validators.required,
            Validators.email
        ])
    );
}

onSubmit (value) {
    this.template.controls.vendor_email['controls'].forEach(
      (element) => {
        let so_eval = '';
        if (element.value.length) {
          so_eval = element.value.split('@');
        }
        if (so_eval.length && so_eval[1].toLowerCase() != 'gmail.com') {
          element.setErrors(null);
        } else {
          element.setErrors({ 'incorrect': true });
        }
      }
    );

    this.template.controls.vendor_email['controls'].forEach(element => {
        if (element.errors) {
        element.errors.pattern || element.errors.email || element.errors.incorrect
            ? templateErrors.push('Add Appropriate email to vendor')
            : null;
        }
    });
}

Я просто хочу добавить ошибкусообщение в поле, которое не является действительным. Заранее спасибо

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...