title: Angular how to default set radio buttons, Reactive forms
body: <p>Implementing a reactive form in Angular with radio buttons. I want to set a default value, I have tried the following:</p>
  
  <h2>Template:</h2>
  
  <pre><code>&lt;form [formGroup]="form" (ngSubmit)="onSubmit(form)" class="actionsForm"&gt;
  
      &lt;input type="radio" id="entertainCrowdSkill1" [value]="skillsForBackend[0]"
      class="radiobuttons" formControlName="skill" [checked]="true"&gt;
  
      &lt;input type="radio" id="entertainCrowdSkill2" [value]="skillsForBackend[1]" 
      class="radiobuttons" formControlName="skill"&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <h2>Model:</h2>
  
  <pre><code>  ngOnInit() {
      this.form = this.fb.group({
        skill: ['', Validators.required],
      });
  
    }
  
    onSubmit(form) {
      console.log(form.controls.skill.value) // logs empty string
  }
  </code></pre>
  
  <p>The button appears to be checked even the <code>CSS:checked</code> class is applied. However, when I try to log the value of skill it is an empty string (the default value entered in the fb). I have seen an <a href="https://stackoverflow.com/questions/43780840/angular-4-default-radio-button-checked-by-default">answer</a> but this was for template driven forms.</p>
  
  <p>How do I set a default value for the radio buttons in the template in a reactive form?</p>