Угловая подача внешней формы

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);
}