How to set an angular mat radio button to selected by default?-CodePudding

I would like to ask , I am using the update angular verion. I was trying to set a mat radio button as selected by default , I tried using [checked]="true" but it does not seem to work . Any idea ? or any update on the syntax? Thanks.

#Code

 <mat-radio-group name="isSubleaseCoterminusWithMasterLease" (change)="onChangeSubleaseCoterminus($event)" [(ngModel)]="dealDispositionFormFields.isSubleaseCoterminusWithMasterLease">
            <div  style="justify-content: space-between;">
              <div  [ngClass]="{'v-bg-color': dealDispositionFormFields.isSubleaseCoterminusWithMasterLease === 'No'}"  >
                <div >
                  <mat-radio-button
                  [checked]='true'
                  *ngIf="dealDispositionFormFields.isSubleaseCoterminusWithMasterLease === 'No' else notSubleaseCoterminusWithMasterLease"    
                    color="accent"
                    [value]="'No'">
                      <span >No</span>
                  </mat-radio-button>
                  <ng-template #notSubleaseCoterminusWithMasterLease>
                    <mat-radio-button
                     [checked]="true"
                      [value]="'No'">
                        No
                    </mat-radio-button>
                  </ng-template>
                </div>
              </div> 
            </div>
          </mat-radio-group>

CodePudding user response：

You can use ngModel inside the <mat-radio-group> tag this as follows

<mat-radio-group  [(ngModel)]="selected">

And in your .ts file

selected: string;  
ngOnInit(){    
   this.selected = "No";
}

Here is a working example: Stackblitz