Default radio button select value angular material 2

Question

I am working on angular material 2 radio button following this documentation:https://material.angular.io/components/component/radio.

The problem that I am facing is to have the radio button a default selected value of No. If you see in the plunker:https://plnkr.co/edit/jdRxVLdSfFqR4XOdpyUN?p=preview you will find that none of the options are selected. I would want the default value to be No when the page loads.

Answer 1

A lot of the plunkrs don't seem to work for me anymore. There's a modified stackblitz here:

Blitz

As mentioned we can either set the ngModel and the variable:

[(ngModel)]="favoriteSeason"

and in the 'ts' file:

  favoriteSeason: string = 'Winter';

Or we can set the checked:

[checked]="season === 'Winter'" 

Another little gotcha I've discovered recently is that if you mistakenly give mat-checkbox incorrect (duplicate IDs), then it does not work - you cannot check anything. Ensure your IDs are unique.

Answer 2

You can use checked, like so:

[checked]="data.value ==='false'" 

notice that we are checking using string 'false', instead of false, as your value has the string with value false.

Plunker