Phil147
commented
3 years ago Hi @SmokillsPT
what you stumbled upon here is the difference of Template Driven vs. Reactive Forms in Angular. You can find some documentation here: https://angular.io/guide/forms-overview#choosing-an-approach
You are using the formControlName directive so Reactive Forms and thus the Validator from your FormControl takes precedence and you should change the validators there. This is a behavior from Angular itself. The required property from the component is in fact only there to use it inside the component, Angular takes care of the validator behind it. The radio button component itself is not doing anything about validation.
So in summary: when using FormControls manage the validators in the FormControl itself, it you are using ngModel use the attributes in the template.
Does that help to make it more clear?
SmokillsPT
Expected Behavior📗
When [require]="false" nx-radio-group should allow Submit without a answer selected
Actual Behavior 📕
[require]="true" and [require]="false" have the same behavior - the nx-radio-group must have a nx-radio selected.
Minimal Reproduction 🔬
You can check the behavior here https://stackblitz.com/edit/angular-p5uex3?file=src/app/radio-button-group-validation-example.html - its a fork of the original demo. I've added two examples, the first have the [require]="false" and the error always shows. The second have no Validators on formControl and no [required] and it works.
Environment
* Library version used: "@aposin/ng-aquila": "^10.9.0"
* Angular and CDK Version: "@angular/core": "~10.1.6" "@angular/cdk": "~10.2.5"
* Browser Name and version: Chrome Version 87.0.4280.141 (Official Build) (64-bit)
* Operating System and version (desktop or mobile):
Additional Information 📖
According to the typescript file radio-button.d.ts : /* Sets if at least an option should be selected. / set required(value: boolean); The behavior should allow a false value.