¿Cómo se pueden extraer los datos para pasarlos al formulario?
user$!: Observable<UserI> ngOnInit(): void { this.user$ = this.userService.getPerson(); this.initializeForm(); } initializeForm(): void { this.form = this.fb.group({ fullName: new FormControl(?, Validators.required), }); }Tienes múltiples opciones:
Puede inicializar el formulario cuando se cargan los datos o puede inicializar el formulario con valores vacíos/predeterminados y actualizar los valores cuando se cargan los datos.
ngOnInit(): void { this.userService.getPerson().pipe( tap(user => this.initializeForm(user)) ).subscribe(); } initializeForm(user: UserI): void { this.form = this.fb.group({ fullName: new FormControl(user.fullName, Validators.required), }); } ngOnInit(): void { this.initializeForm(); this.userService.getPerson().pipe( tap(user => { this.form.get('fullName').setValue(user.FullName); }) ).subscribe(); } initializeForm(): void { this.form = this.fb.group({ fullName: new FormControl('', Validators.required), }); }Personalmente prefiero crear campos para mis controles:
readonly fullName = new FormControl('', Validators.required); ngOnInit(): void { this.initializeForm(); this.userService.getPerson().pipe( tap(user => { this.fullName.setValue(user.FullName); }) ).subscribe(); } initializeForm(): void { this.form = this.fb.group({ fullName: this.fullName, }); }Entonces puedo acceder a ellos directamente, incluso en html
<input [formControl]="fullName"/> <span *ngIf="fullName.errors?.required">Fullname is required</span>