带有 *ngIf 的表单抛出错误消息

Question

我有以下 html/angular-code，我只想在 "selected":

时执行

<form *ngIf="selected" (ngSubmit)="onSubmit()" #f="ngForm">
  <!-- somme more code -->
      <button
        type="submit"
        class="btn btn-primary"
        [disabled]="!f.valid"
        (click)="onClick()"
      >Save
      </button>
  </form>

我收到错误消息：由于表单未连接，表单提交已取消

没有 *ngIf 一切正常。我想，这是因为 (ngSubmit)="onSubmit()" #f="ngForm" 没有在页面启动时初始化。

可是我怎么可能呢？谢谢。

Answer 1

您可以将 *ngIf 条件放在空容器元素中

<form (ngSubmit)="onSubmit()" #f="ngForm">
    <ng-container *ngIf="selected">
    ... form children ....
    </ng-container>
</form

带有 *ngIf 的表单抛出错误消息

form with *ngIf throws error message

forms

angular-ng-if

angular