Tengo Root FormGroup que contiene diferentes FormGroup diferentes. Quiero aplicar el validador en el control entre dos o más FormGroup.

Por ejemplo:

Tengo dos FormGroup mobile y workPhone y cada FormGroup tiene diferentes controles como el number , etc.

Ahora tengo que escribir el validador tanto en el móvil como en el teléfono de trabajo para que se convierta en uno opcional al ingresar el valor en el control de números. para obtener más referencias, consulte el ejemplo en stackblitz .

cómo lograr este control inicial será necesario. Pero cuando introduzco el número de teléfono del trabajo, el número de móvil debería convertirse en opcional y viceversa.

appcomponent.ts

 import { Component, OnInit } from '@angular/core'; import { AbstractControl, FormBuilder, FormControl, FormGroup, ValidationErrors, ValidatorFn, Validators, } from '@angular/forms'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'], }) export class AppComponent implements OnInit { rootForm!: FormGroup; constructor(private fb: FormBuilder) {} ngOnInit() { this.rootForm = this.fb.group( { mobile: new FormGroup({ countryCode: new FormControl('+1'), number: new FormControl('', [Validators.required]), }), workPhone: new FormGroup({ countryCode: new FormControl('+1'), number: new FormControl('', [Validators.required]), }), }, { Validators: EitherMobileOrWorkPhoneRequired } ); } public onSubmit(value) { console.log('Form Invalid:' + this.rootForm.invalid); } } export const EitherMobileOrWorkPhoneRequired: ValidatorFn = ( control: AbstractControl ): ValidationErrors | null => { console.log(control); return null; };

Si se requieren otros detalles. Por favor hagamelo saber. Gracias.