角提交外部表格

Question

在单击表单外部的按钮时，我需要在表单上调用submit，并将FormGroupDirective.submitted更改为true。

我有下一个布局

<form (ngSubmit)="submit()" #myForm [formGroup]="formGroup">
...
</form>

<button (click)="formGroupDirective.ngSubmit.emit()" *ngIf="showEditControl"
    class="btn btn_blue mr-3 button-save" type="submit">
    {{'buttons.save' | translate}}
</button>

和component.ts

@ViewChild('myForm', {read: FormGroupDirective}) formGroupDirective: FormGroupDirective;

这确实会调用(ngSumit)，但是属性submitted不会更改。由于submitted为readonly，因此更改属性本身并不好。在这里可以做什么（除了创建隐藏的提交按钮并模拟点击之外）？

Answer 1

使用它。

在html中：

<form [formGroup]="form" #myForm="ngForm">
    // ...Form Controls
</form>

<button (click)="submitForm()" *ngIf="showEditControl" class="btn btn_blue mr-3 button-save" type="submit">
    {{'buttons.save' | translate}}
</button>

和component.ts

中

@ViewChild('myForm') form: FormGroupDirective;

formGroup: FormGroup = new FormGroup({
    myInput: new FormControl(''),
    //etc...
});

submitForm() {
    this.form.onSubmit(undefined);
}