CODEWITHSUNDEEP
angularradio-buttonangular5frontendng-switch
dEs12ZER
dEs12ZER

Reputation: 848

how to implement Radio Button with ng-switch in angular5?

Working with angular5 , i found this code in internet , i tried to run it as i want the same thing in my application , it doesn't work as expected ,the problem is that i can check all the radio Button , also i can see the first message even before chooosing any of the radio button elements.

<form>
      Pick a topic:
      <input type="radio" ng-model="myVar" value="dogs">Dogs
      <input type="radio" ng-model="myVar" value="tuts">Tutorials
      <input type="radio" ng-model="myVar" value="cars">Cars
    </form>

    <div ng-switch="myVar">
      <div ng-switch-when="dogs">
         <h1>Dogs</h1>
         <p>Welcome to a world of dogs.</p>
      </div>
      <div ng-switch-when="tuts">
         <h1>Tutorials</h1>
         <p>Learn from examples.</p>
      </div>
      <div ng-switch-when="cars">
         <h1>Cars</h1>
         <p>Read about cars.</p>
      </div>
    </div>

Any idea why this doesnt work for me ? i have not imported any library to work with this exemple .

This is the link im using for this exemple , but it doesnt work for me as in this link .

Upvotes: 1

Views: 1292

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222682

You can do the following with angular

<input type="radio" value="dogs" name="comp" [(ngModel)]="radioValue"> A
<input type="radio" value="tuts" name="comp" [(ngModel)]="radioValue"> B
<input type="radio" value="cars" name="comp" [(ngModel)]="radioValue"> C

STACKBLITZ DEMO

Upvotes: 1

Related Questions