title: Keep radio bottom default value checked after form resets - Angular 6
body: <p>I have two material radio buttons that one of them set to default inside my Angular reactive Form. After the form submits (staying on the same page) I want to preform a reset to all of the form-control's and return the default selected radio button to checked mode.   </p>
  
  <p>So I created a <code>radioBtnDefault</code> prop inside my TS and set it to true, after the form resets I trying to set it to <code>false</code> and then back to <code>true</code> but i seems that the form reset function don't completes until the value is returned to true, because when I use <code>setTimeOut</code> with a small delay it works fine.
  Any suggestions how to use it without the <code>setTimeOut</code> function will be appreciated.  </p>
  
  <p>HTML</p>
  
  <pre><code> &lt;mat-radio-button class="inner-container__form__inputs__participants__buttons__btn" [checked]="radioBtnDefault" value="1"
                  (click)="onClickedOneParticipant()"&gt;No
   &lt;/mat-radio-button&gt;
  </code></pre>
  
  <p>TS</p>
  
  <pre><code>this.editMode = false;
      this.formSubmitted = false;
      this.colorSelectionOpen = false;
      this.radioBtnDefault = false;
      this.appointmentsCreationForm.reset();
      this.appointmentsCreationForm.get('participants').setValue('1');
      this.selectedBackgroundColor = '#EB5757';
      this.selectedTextColor = '#FFF';
  
  
      setTimeout(() =&gt; {
        this.radioBtnDefault = true;
      }, 100);
  </code></pre>