FormBase

Abstração para formulários

Métodos

submit

Este método irá submeter o formulário e definirá o atributo submitLoader$ como true e após a conclusão ou erro da requisição definirá como false.

Informe $event no parâmetro para que ocorra o preventDefault().

Para que este método funcione, deverá ser marcado no componente cat-form com #form, para que seja possível capturar o componente de formulário através do @ViewChield.

submitLoader$

Este atributo trata-se de um BehaviorSubject<boolean> que poderá ser utilizado para definir estado dos componentes quando o formulário for submetido atrás do método submit.

Caso de Uso

import { CatFormBase } from "@catrx/ui/common";
import { CatFormService } from "@catrx/ui/form";

@Component({
  template: `<form (submit)="submit($event)">
    <cat-form [config]="formConfig"></cat-form>
    <cat-primary-button type="submit" [showLoader]="submitLoader$ | async">
      Enviar
    </cat-primary-button>
  </form>`
})
export class FormComponent extends CatFormBase {
  formConfig = this.formService
    .build()
    .text('Nome', 'name', builder => 
      builder.setRequired().generate()
    )
    .onSubmit(data => this.service.save(data))
    .generate()
  
  constructor(private formService: CatFormService) {
    super();
  }
}

Last updated