How to bind default value in mat-radio-group angular reactive forms

Question

In my case, it needs to activate option 01 as the default choice. It works with the verified true value, but the value is not required with formControlName = "options", it is mandatory when the user selects any parameter. if no user selection parameter values ​​are displayed as "null".

<div class="row"> <mat-radio-group formControlName="options"> <mat-radio-button checked=true value="1">Option 01</mat-radio-button> <mat-radio-button value="2">Option 02</mat-radio-button> </mat-radio-group> </div> 

Please help me solve this problem. Thanks.

Answer 1

What you want to do is remove checked and set the pre-selected value to formControl , so when creating the form:

 constructor(private fb: FormBuilder) { this.myForm = this.fb.group({ options: ['1'] }) } 

and then just remove the checked attribute:

 <mat-radio-group formControlName="options"> <mat-radio-button value="1">Option 01</mat-radio-button> <mat-radio-button value="2">Option 02</mat-radio-button> </mat-radio-group>