title: disable/enable input filed when checkbox is checked or unchecked using validations in reactive forms ANGULAR 8
body: <p>Initally last name and options checkboxes are disbaled. I want to enable last name and options checkboxes when the AllOW checkbox is checked.I am trying to write a custom validation for it, or is there any other way to do it using the form control name<br>
  Template</p>
  
  <pre><code>&lt;form [formGroup]="empForm" (ngSubmit)="onSubmit()"&gt;
  
      &lt;div formArrayName="employees" &gt;
  
          &lt;div *ngFor="let employee of employees().controls; let empIndex=index"&gt;
  
              &lt;div [formGroupName]="empIndex" style="border: 1px solid blue; padding: 10px; width: 600px; margin: 5px;"&gt;
                  {{empIndex}}
                  First Name :
                  &lt;input type="text" formControlName="firstName"&gt;
          &lt;label class="checkbox-inline"&gt;
                        &lt;input type="checkbox" /&gt;ALLOW&lt;/label
                      &gt;
                  &lt;div&gt;
  
                       Last Name:
                  &lt;input type="text" formControlName="lastName"&gt;
                      &lt;label class="checkbox-inline"  *ngFor="let day of 
                         days; "&gt;
                          &lt;input
                            type="checkbox"
                            formControlName="{{ day.name }}"
                            name="{{ day.name }}"
                             (change)="onChange(empIndex,day.value , 
                          $event.target.checked)"
                          /&gt;{{ day.value }}
                        &lt;/label&gt;
                  &lt;/div&gt;
                  &lt;button 
                   (click)="removeEmployee(empIndex)"&gt;Remove&lt;/button&gt;
  
  
                  &lt;div formArrayName="skills"&gt;
  
                      &lt;div *ngFor="let skill of 
                        employeeSkills(empIndex).controls; let 
                            skillIndex=index"&gt;
  
  
  
                          &lt;div [formGroupName]="skillIndex"&gt;
                              {{skillIndex}}
                      Skill :
                      &lt;select  formControlName="skill" id="skill"&gt;
                       &lt;option&gt;JAVA&lt;/option&gt;
                       &lt;option&gt;Python&lt;/option&gt;
                       &lt;option&gt;C#&lt;/option&gt;
                      &lt;/select&gt;
                       Exp:
                      &lt;select  formControlName="exp" id="exp"&gt;
                       &lt;option&gt;1&lt;/option&gt;
                       &lt;option&gt;2&lt;/option&gt;
                       &lt;option&gt;3&lt;/option&gt;
                     &lt;/select&gt;
  
  
                  &lt;button
                     (click)="removeEmployeeSkill(empIndex,skillIndex)"&gt;
                  Remove&lt;/button&gt;
  
                              &lt;pre&gt;{{skillIndex.value |json}}&lt;/pre&gt;
                          &lt;/div&gt;
  
                      &lt;/div&gt;
                      &lt;button type="button" 
                     (click)="addEmployeeSkill(empIndex)"&gt;Add Skill
                     &lt;/button&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;p&gt;
          &lt;button type="submit"&gt;Submit&lt;/button&gt;
      &lt;/p&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p><a href="https://stackblitz.com/edit/angular-pg1t9r" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-pg1t9r</a></p>