Angular:FormBuild

TS

import { Component, OnInit } from '@angular/core'; import { FormBuilder, FormControl, FormGroup } from '@angular/forms'; import { ActivatedRoute } from '@angular/router'; import { SocialChangePassword } from 'src/app/000_class/social-change-password'; import { BrapciService } from 'src/app/000_core/010_services/brapci.service';

@Component({ selector: 'app-change-password', templateUrl: './change-password.component.html', }) export class ChangePasswordComponent { formCliente: FormGroup<any> | any; apikey:string = parms:Array<any>|any

ngOnInit() { this.createForm(new SocialChangePassword());

this.parms = this.route.params.subscribe((params) => { this.apikey = params['id']; // (+) converts string 'id' to a number this.formCliente.controls['apikey'].setValue(this.apikey);

}); }

constructor( private formBuilder: FormBuilder, private brapciService: BrapciService, private route: ActivatedRoute ) {}

createForm(cliente: SocialChangePassword) { this.formCliente = this.formBuilder.group({ pass1: [cliente.pass1], pass2: [cliente.pass2], apikey: [cliente.apikey], }); }

onSubmit() { // aqui você pode implementar a logica para fazer seu formulário salvar console.log(this.formCliente.value);

// chamando a função createForm para limpar os campos na tela this.createForm(new SocialChangePassword()); } }

html

<form [formGroup]="formCliente" (ngSubmit)="onSubmit()">

<label for="dataNascimento">Informe a nova senha</label> <input type="text" class="form-control" name="pass1" id="pass1" formControlName="pass1">

<label for="pass2">Confirme nova senha</label> <input type="text" class="form-control" name="pass2" id="pass2" formControlName="pass2">

<input type="submit" class="btn btn-outline-primary me-2" value="Salvar"> <a href="#" class="btn btn-outline-secondary me-2">Cancelar</a>

</form>