Angular программная отправка реактивной формы без кнопки

Question

Я хотел бы отправить форму автоматически, когда все поля в форме действительны.

Как я могу инициировать отправку формы с кодами, но без кнопок?

Вот пример формы:

<form [formGroup]="dummyForm">
  <label>
    <input type="text" formControlName="dummyText" ng-change="autoSubmit()"/>
  </label>
</form>

component.ts:

import { Component } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { RxFormBuilder, RxwebValidators } from '@rxweb/reactive-form-validators';

@Component({
  selector: 'dummy-page',
  templateUrl: './dummy.component.html',
  styleUrls: ['./dummy.component.sass']
})
export class DummyComponent {
  dummyForm: FormGroup;

  constructor(
    private readonly _formBuilder: RxFormBuilder
  ) {
    // Do something here
  }
  ngOnInit(): void {
    this.dummyForm = this._formBuilder.group({
      dummyText: ['', [
         RxwebValidators.pattern({
           pattern: {
             validPattern: /^1234$/
           }
         })
      ]]
    });
  }
  autoSubmit(): void {
    if (!this.dummyForm.valid) {
      return;
    } else {
      // Trigger form submission here, how?
    }
  }
}

Answer 1

Вы можете подписаться на statusChanges, наблюдаемые в вашей FormGroup, следующим образом:

this.dummyForm.statusChanges.subscribe(status => {
   if (status === 'VALID') {
      // form submission here
   }
});

Answer 2

Вы можете подписаться на форме valueChanges

    this.dummyForm.valueChanges.subscribe({
      next: data => {
        if (this.dummyForm.valid) {
           // send data
        }
      },
    });