Antd Angular проверка входной группы в formArray - PullRequest
0 голосов
/ 06 апреля 2020

В основном у меня есть массив массива inputGroups, я использую ng-Zorro (antd Angular) и пытаюсь проверить мою inputGroup и отобразить сообщения об ошибках В соответствии с тем, какой элемент управления неправильный : Вот Шаблон формы:

<form nz-form [formGroup]="form">
<ng-container formArrayName="clouds">
  <nz-form-item *ngFor="let n of getClouds().controls; let ni = index;" [formGroupName]="ni">
    <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="nuages" nzRequired>Cloud {{ni+1}}</nz-form-label>
    <nz-form-control [nzSm]="14" [nzXs]="24" [nzValidateStatus]="n.get('height')" 
    nzErrorTip="Must be three digit number !">
      <nz-input-group [nzAddOnBefore]="addOnBeforeTemplate">
        <ng-template #addOnBeforeTemplate>
          <nz-select formControlName="cloud" nzAllowClear style="width: 64px;">
            <nz-option nzValue="Cumulus" nzLabel="Cumulus"></nz-option>
            <nz-option nzValue="Cirrus" nzLabel="Cirrus"></nz-option>
          </nz-select>
        </ng-template>
        <input nz-input formControlName="height" placeholder="height" style="width: 64px" />
      </nz-input-group>
    </nz-form-control>
  </nz-form-item>
</ng-container>

и файл формы TS:

ngOnInit(): void {
this.form = this.fb.group({
  clouds: this.fb.array([this.createCloudControl()])
})


createCloudControl() {
return this.fb.group({
  cloud: [, [Validators.required]],
  height: ['', [Validators.required, Validators.pattern("^[0-9]{3}$")]],
})

}

Проблема в том, что поле "облако" требуется, но сообщение об ошибке не отображается, если оно не указано. Поле "высота" работает нормально, и отображается сообщение об ошибке. Что я хочу, это , чтобы отобразить сообщение об ошибке. В зависимости от того, какое поле является недействительным

Заранее спасибо

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