<form [formGroup]="regForm" novalidate>
<ion-list radio-group
formControlName="questionAnswer"
*ngFor="let questionAnswer of questionAnswers, let i=index">
<ion-label class="custom-label"><span class="custom-required"></span>
{{questionAnswer.label}}
<p class="custom-required-text">
<!--*ngIf="questionForm.controls.answer.valid && submitted"-->
Required
</p>
</ion-label>
<ion-item *ngFor="let answers of questionAnswer.answersList; let idx = index" class="clear-background custom-radio">
<ion-label><span class="item-number">{{idx + 1}}. </span><span class="info">{{answers.label}}</span></ion-label>
<ion-radio formControlName="answer" [value]="answers.answerId" required (click)="">{{answers.label}}</ion-radio>
</ion-item>
</ion-list>
</form>
if you mean validate if they are empty or not you can use the Validators
let’s say that you have a FormBuilder
with the name form
and the form in your html page is called regForm
you can do the following in the constructor :
this.regForm = form.group({
answer : ['', Validators.required]
});
and then if you want to check if the form is valid you can write :
this.regForm.valid
=>this will return true if the form is valid
we don’t have your code and don’t have any description so that is the most far I can help you with
Thanks for your quick response!!
I have setup the form using formBuilder
this.regForm = this.formBuilder.group({
answer: [’’, Validators.required]
});
but I am getting the following error.
ERROR Error: No value accessor for form control with name: 'answer’
at _throwError (forms.es5.js:1833)
at setUpControl (forms.es5.js:1743)
at FormGroupDirective.addControl (forms.es5.js:4714)
at bound.FormControlName._setUpControl (forms.es5.js:5302)
at bound.FormControlName.ngOnChanges (forms.es5.js:5220)
at checkAndUpdateDirectiveInline (core.es5.js:10702)
at checkAndUpdateNodeInline (core.es5.js:12084)
at checkAndUpdateNode (core.es5.js:12052)
at debugCheckAndUpdateNode (core.es5.js:12681)
at debugCheckDirectivesFn (core.es5.js:12622)
It seems to me like you are looping across questionAnswers.answersList
yet always attempting to bind each radio button to answer
. This doesn’t make much sense to me. I also don’t see why you have both formControlName
and [value]
. Shouldn’t it be one or the other?
I did not have formControlName=“answer” earlier. {{ regForm.controls.questionAnswer.valid }} is always true even though I never selected anything. I thought maybe formControlName needs to be added at the radio level hence its there. I am new to Ionic 3. Any links or tips are appreciated. Thanks!