Angular NgForm form.resetForm 和 form.reset 不适用于数组

Question

我有一个简单的 ngForm，它可以很好地处理字符串输入和单个 select 下拉菜单。我想添加引入数组的 multi-select 下拉列表。我面临一个奇怪的问题。当我保存/重置我正在使用 form.formReset() 的表单时，但我仍然收到 "field required validation" 错误消息并且刷新将其清除。

引入了验证问题 post multi-select。我尝试了几件事但没有运气。下面的代码 -

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

的原始和肮脏属性

Answer 1

经过大量讨论和论坛。我建议在 multi-select 组件内部进行更改，可能检查组件内部的重置功能或创建一个并尝试添加 .markAsPristine() 和 .markAsUntouched() 通过在单击重置时检查条件，即空白价值 selected.

Angular NgForm form.resetForm 和 form.reset 不适用于数组

Angular NgForm form.resetForm and form.reset not working with array

angular

typescript

angular-forms