default mat radio button check-CodePudding

I tried now a few ways to set a mat radio button checked by default but none of these were working. Currently, my solution looks like that, which is also not working:

<mat-radio-group name="personTypOperator" [(ngModel)]="personTypOperator" (change)="sendToFilter()" >
  <mat-radio-button checked value="and"  > Und </mat-radio-button>
  <mat-radio-button value="or" > Oder </mat-radio-button>
  <mat-radio-button value="not"> Nicht </mat-radio-button>
</mat-radio-group>

I tried it this way through the "checked" element. I also tried [checked] before and it was also a failure. What is the correct way to do it?

CodePudding user response：

To select the 1st radio button option by default, you can initialize the personTypOperator property value in your Component ts file as:

personTypOperator = 'and';

// in case if assignment done within any function
this.personTypOperator = 'and';

CodePudding user response：

If you can not solve your problem by updating the angular and material or by removing npm and reinstalling it, you can also try this method: use the

<mat-checkbox>

instead of the

<mat-radio-button>

And use

<mat-form-field>

<ng-container matColumnDef = "checked">

<div>

or ... as the parent tag.

CodePudding user response：

<mat-radio-group name="personTypOperator" [(ngModel)]="personTypOperator" (change)="sendToFilter()" >
  <mat-radio-button checked value="and" checked="true" > Und </mat-radio-button>
  <mat-radio-button value="or" > Oder </mat-radio-button>
  <mat-radio-button value="not"> Nicht </mat-radio-button>
</mat-radio-group>