title: Angular: Setting the default value in mat select from API call
body: <p>What is the optimal way of setting the Default Value for a Angular Material Select dropdown? The mat select is calling an API which populates the dropdown list. Then its preselecting the value to <code>defaultAddressFormat</code> variable. Its being done in the subscribe function.</p>
  
  <p>Curious if there is more optimal way of doing this, 
  <code>this.addressService.getAddressFormatAll()</code> is an observable</p>
  
  <p>After presetting value, user should be able to select different selection if needed.</p>
  
  <p>If the default is set before API fully loads,  sometimes it may not render, so being called in subscribe method.</p>
  
  <pre><code>this.addressService.getAddressFormatAll().subscribe(res =&gt; {
      this.addressFormatList = res.body;
      if (this.addressFormatList.length &gt; 1) {
        this.addressHeaderForm.patchValue({ addressFormat: this.defaultAddressFormat });
      }
  });
  
  
  &lt;mat-form-field&gt;
       &lt;mat-label&gt;Address Format&lt;/mat-label&gt;
       &lt;mat-select
            formControlName = "addressFormat"
            [compareWith]="compareAddressFormatDataObjects"
            placeholder ="Select"
            (selectionChange)="addressFormatChangeEvent($event)" required &gt;
            &lt;mat-option (click)="addressHeaderForm.controls.addressFormat.reset()"&gt;Select&lt;/mat-option&gt;
            &lt;mat-option
                 *ngFor="let addressFormatItem of addressFormatList"
                 [value]="addressFormatItem"
             &gt;
             {{addressFormatItem.addressFormatDescription}}
             &lt;/mat-option&gt;
        &lt;/mat-select&gt;
    &lt;/mat-form-field&gt; 
  </code></pre>
  
  <p>Other resources: </p>
  
  <p><a href="https://stackoverflow.com/questions/50650790/set-default-option-in-mat-select">Set default option in mat-select</a></p>
  
  <p><a href="https://stackoverflow.com/questions/47333171/angular-material-mat-select-not-selecting-default">Angular Material: mat-select not selecting default</a></p>