Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 5 reactive form - disable one radio option in radio group

I have a radio group which uses the same form control for each option. Is it possible to disable just the red radio button? I know you can set the disabled flag on the color form control but this will disabled all radio buttons.

<fieldset [formGroup]="colorForm">
    <legend>
      Choose color
    </legend>

<div class="radio">
  <label>
    <input type="radio" value="red" formControlName="color">
    Red
  </label>
</div>

<div class="radio">
  <label>
    <input type="radio" value="green" formControlName="color">
    Green
  </label>
</div>

<div class="radio">
  <label>
    <input type="radio" value="blue" formControlName="color">
    Blue
  </label>
</div>
like image 441
BSimpson Avatar asked Jan 24 '18 05:01

BSimpson


1 Answers

try this out

 <input type="radio" [attr.disabled]="propertyName === false || null"" 
  value="red" formControlName="color">

propertyName i.e. value comes from components.ts file

like image 91
Pranay Rana Avatar answered Sep 28 '22 05:09

Pranay Rana