CODEWITHSUNDEEP
javascripthtmlformsangularangular-ng-if
Fabian Tschullik
Fabian Tschullik

Reputation: 145

Show and hide inputs depending on radio button angular 2

I would like to show and hide addtional input fields depending on a radio button value.

Radio

<div class="form-group">
  <label>Was möchten Sie bewerten?</label>
            <div class="radio">
              <label><input type="radio" [(ngModel)]="type" name="type" value="ETW">Eigentumswohnung</label>
            </div>
            <div class="radio">
              <label><input type="radio" [(ngModel)]="type" name="type" value= "EFH">Einfamilienhaus</label>
            </div>
            <div class="radio">
              <label><input type="radio" [(ngModel)]="type" name="type" value="ZFH">Mehrfamilienhaus</label>
            </div>
  </div

This form/elemnt I would like to show if the value of type is "EFH" or "ZFH"

  <div *ngIf="" class="form-group">

Upvotes: 1

Views: 7090

Answers (1)

Noor Ahmed
Noor Ahmed

Reputation: 1617

As your radio buttons are binded to some property using ngModel, you can use your radio buttons model property to check (show/hide) the div's.

Example :

  <div *ngIf="type == 'EFG' || type == 'ZFH'" class="form-group">

Upvotes: 4

Related Questions