Tengo un formulario que necesita verificar si una de un grupo de casillas de verificación está marcada si un menú desplegable tiene un valor específico. Tengo un validador que funciona en las casillas de verificación, pero solo lo necesito para verificar si el menú desplegable es un valor específico. A continuación se muestra el formulario y el código de validación. He intentado que el validador se vincule así. RequireCheckboxesValidator.bind (esto), pero luego parece ignorar el validador.
readonly closeFormGroup: FormGroup; constructor( formBuilder: FormBuilder, ) { this.closeFormGroup = formBuilder.group({ notes: [null], reason: [1, Validators.required], checkBoxGroup: new FormGroup({ checkBox1: new FormControl(false), checkBox2: new FormControl(false), checkBox3: new FormControl(false), checkBox4: new FormControl(false), checkBox5: new FormControl(false), } ,this.requireCheckboxesValidator()) }); } public requireCheckboxesValidator(): ValidatorFn { return function validate(formGroup: FormGroup) { let checked = 0; console.log(formGroup); Object.keys(formGroup.controls).forEach(key => { const control = formGroup.controls[key]; if (control.value === true) { checked++; } }); if (checked < 1) { return { requireCheckboxesToBeChecked: true, }; } return null; }; }Puedo sugerir un enfoque diferente.
Puede suscribirse a valueChanges de su campo desplegable y luego, si el valor específico que se selecciona es lo que espera, puede usar addValidator para agregar el validador determinado a su control de formulario de casillas de verificación.
También me gusta su idea de agregar un validador personalizado (definitivamente el mejor enfoque) y también debería funcionar de esa manera. Por lo que entiendo, está tratando de agregar el validador para las casillas de verificación solo si el menú desplegable tiene un valor específico. En ese caso, debe cambiar su lógica a algo como:
Object.keys(formGroup.controls).forEach(key => { const control = formGroup.controls[key]; if (control.value === true) { checked++; } let dropdownValue = undefined; if (key === 'dropdownFormControlKey') { dropdownValue = control.value; } }); if (checked < 1) { // --- Add check to also see if the dropdown's value is what you expect and only then return the error return { requireCheckboxesToBeChecked: true, }; } return null; };