Angular NgForm form.resetForm и form.reset не работают с массивом - PullRequest
0 голосов
/ 02 мая 2020

У меня есть простой ngForm, который отлично работал со строковым вводом и выпадающим списком. Я хотел добавить выпадающий список с множественным выбором, который представляет массив. Я сталкиваюсь со странной проблемой. Когда я сохраняю / сбрасываю форму, я использую form.formReset(), но я все еще получаю сообщение об ошибке «Требуется проверка поля», а refre sh очищает его.

Введена проблема проверки после многократного выбора. Я попробовал пару вещей, но не повезло. код ниже -

<form #form="ngForm"
      class="form-horizontal"
      (ngSubmit)="save(form)">
  <inf-modal #modal
             (onHide)="form.resetForm()"
             size="medium">
    <mat-card>
      <mat-card-title class="inf-modal-title">
        Modal View
        <button type="button"
                class="close"
                aria-label="Close"
                (click)="modal.hide()">
          <span aria-hidden="true">
            <mat-icon>clear</mat-icon>
          </span>
        </button>
      </mat-card-title>
      <mat-card-content>
        <div class="row">
          <div class="col-lg-12">
            <div class="form-group">
              <div class="row">
                <div class="col-lg-8">
                  <inf-person-org-composite-entity-selector name="autocompleteSelector"
                                                            [(ngModel)]="selectedTarget"
                                                            (ngModelChange)="storeTargetId($event)"
                                                            [blackList]="blacklistedTargets"
                                                            [multiSelect]="false"
                                                            [required]="true"
                                                            [placeholder]="'Name"

                                                            [entitySelectorVisible]="false">
                  </inf-person-org-composite-entity-selector>
                </div>

                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="row"
             *ngIf="!isTargetInvestigation()">
          <div class="col-lg-6">
            <inf-multiselect #linkType="ngModel"
                        name="linkType"
                        [(ngModel)]="record.linkType"
                        [optionKey]="'linkType'"
                        [placeholder]="'linkType' "
                        [required]="true"></inf-multiselect>
          </div>
        </div>
        <div class="row"
             *ngIf="!isTargetInvestigation()">
          <div class="col-lg-12">
            <div class="form-group">
              <mat-form-field>
                <input matInput
                       #comment="ngModel"
                       [(ngModel)]="record.comment"
                       name="comment"
                       [placeholder]="'comment' ">
              </mat-form-field>
            </div>
          </div>
        </div>
      </mat-card-content>
      <mat-card-actions>
        <button type="button"
                (click)="modal.hide()"
                mat-button
                color="primary">{{ 'common.cancel' | translate }}
        </button>
        <button type="reset"
                (click)="form.resetForm()"
                mat-button
                color="primary">{{ 'common.reset' | translate }}
        </button>
        <button mat-raised-button
                color="primary"
                type="submit">{{ 'common.assign' | translate}}
        </button>
      </mat-card-actions>
    </mat-card>
  </inf-modal>
</form>

не знаю, что мне не хватает, я даже пытался играть с нетронутыми и грязными свойствами ngForm.

enter image description here

1 Ответ

0 голосов
/ 04 мая 2020

После много дискуссий и форумов. Я бы посоветовал внести изменения в компонент с несколькими вариантами выбора, возможно, проверить функцию сброса внутри компонента или создать функцию и попробовать добавить .markAsPristine () и .markAsUntouched (), проверяя условие при каждом нажатии кнопки сброса, то есть при выборе пустого значения.

...