Question

Add a radio Button in UI , by using Visual Studio code

Add a Radio button in UI , by Using visual Studio code in Angular or Angular Js Format.

Answer 1

Kindly upvote if this helped

- To add a radiobutton, we must give same name to the radio element.
- We need to pass different values to the value key to give different values to radiobutton list.
- We can give the default selected value as well in angular while working with radio buttons as a particular value will be selected by default if the user lands on the screen.

Consider the below code snippet to add a radio button.

- There is a parameter called [checked] = 'true'. It gives the default selected value.
- Below code will make 3 radio buttons with options as YES , NO , MAY BE

<div class="myclass">  
            <label>  
                <input type="radio" name="optionlist" value="YES" (click)="setradio('YES')" [checked]='true' ngModel>  
               YES
            </label>  
        </div>  
        <div class="myclass">  
            <label>  
                <input type="radio" name="optionlist" value="NO" (click)="setradio('NO')" ngModel>  
             NO
            </label>  
        </div>   
                <div class="myclass">  
            <label>  
                <input type="radio" name="optionlist" value="MAY BE" (click)="setradio('MAY BE')" [checked]='true' ngModel>  
                MAY BE
            </label>  
        </div>  

OUTPUT: