下面是一个简单的解决方法,该方法使用Angular 13的自定义验证器来确保至少一个复选框是选中的。
import { ValidatorFn, FormGroup } from '@angular/forms';
export const atLeastOneValidator: ValidatorFn = (fg: FormGroup) => { const valuesSelected = Object.keys(fg.controls) .map(key => fg.controls[key].value) .filter(value => !!value); const atLeastOne = valuesSelected.length > 0; return atLeastOne ? null : { atLeastOneSelected: true }; }
import { Validators } from '@angular/forms'; import { atLeastOneValidator } from './at-least-one-validator';
...
checkboxGroup: FormGroup = this.fb.group({ checkboxOption1: [false], checkboxOption2: [false], checkboxOption3: [false] }, { validators: Validators.compose([ Validators.required, // This is just an example, you can remove this if not needed atLeastOneValidator ]) });
这就是一个简单的解决方法,它使用自定义验证器检查至少一个复选框已被选中。