CODEWITHSUNDEEP
angular
User569
User569

Reputation: 51

How to set radio button selected by default in angular 8?

I am very new to angular 8 technology and have some problem setting one of the radio button checked by default.

I have tried to add some of these attributes [checked]="true", checked but problem is still the same.

HTML

<div class="form-check">
    <mat-radio-button type="radio" id="materialUnchecked" name="filterType" 
        value="0" [(ngModel)]="filterType" [checked]="true">
        By client
    </mat-radio-button>

    <mat-radio-button type="radio" id="materialChecked" name="filterType" 
        value="1" [(ngModel)]="filterType">
        By student
    </mat-radio-button>
    <br><br>
</div>

TS

protected filterType;

Any help would be appreciated. Thanks

Upvotes: 5

Views: 42568

Answers (2)

Aastick
Aastick

Reputation: 101

set filterType value to true in your ngOnInit.

this.filterType=1;

Upvotes: 4

RS17
RS17

Reputation: 813

Set default value for a variable and use like below
Here I have used flag as the default variable

TS

 import { Component } from '@angular/core';

    @Component({
      selector: 'my-app',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css']
    })
    export class AppComponent {
      name = 'Angular';
      flag: any;
      constructor() {
        this.flag = 0;
      }
    }

HTML

<input type="radio" name="1" id="1" class="with-gap" [(ngModel)]="flag" [value]="0">
<input type="radio" name="2" id="2" class="with-gap" [(ngModel)]="flag" [value]="1" >
{{flag}}

This is the stackblitz url

https://stackblitz.com/edit/angular-dyy5y8

Upvotes: 11

Related Questions