Question

我有两种形式，验证是在提交时触发的，然后才显示给用户。但是，我需要同时在两个表单上触发此提交，以便显示必填字段。

现在我有类似的东西

<form [formGroup]="formGroup" #myForm="ngForm" ngForm (ngSubmit)="onSubmit()" *ngIf="formAssemblyCompleted; else loader>
...
</form>

<form [formGroup]="form2" class="mb-5">
</form>

<button class="btn btn_orange" type="submit (click)="myForm.ngSubmit.emit(true)">
    Submit
</button>

在组件中

@ViewChild('myForm') myForm: NgForm;

绑定到ngSubmit的函数将按应有的方式被调用，但是submitted的{{1}}属性不会将其状态更改为myForm

Answer 1

这个问题早就完成了，但是我有答案。 myForm.ngSubmit.emit(true)将仅触发EventEmitter，该事件将调用(ngSubmit)="onSubmit()"传递的函数。查看代码，我注意到将submitted变为true的函数是onSubmit($event)。它还将发出ngSubmit。这是代码的摘录。

onSubmit($event: Event): boolean {
    (this as {submitted: boolean}).submitted = true;
    syncPendingControls(this.form, this._directives);
    this.ngSubmit.emit($event);
    return false;
  }

https://github.com/angular/angular/blob/9.1.11/packages/forms/src/directives/ng_form.ts#L288-L301

因此，在您的情况下，您需要这样做：

<button class="btn btn_orange" type="submit (click)="myForm.onSubmit($event)">
    Submit
</button>

ngSubmit.emit（）不会更改formGroup

1 个答案: