title: mat-select: Programmatically pre-selecting items
body: <p>I am trying to figure out how to display a mat-select in a dialog and have some of the mat-options preselected. I've created a simple example to demonstrate what I want to do:</p>
  
  <p><a href="https://stackblitz.com/edit/material-angular-select-defaults-example?embed=1&amp;file=src/app/app.component.ts" rel="nofollow noreferrer">StackBlitz</a></p>
  
  <p>In my example, I want to display a selectable list of colors, with a few of the colors preselected. I first create a mat-select and its contents (mat-options) by iterating over an array of strings in my dialog's TS file:</p>
  
  <pre><code>&lt;mat-select placeholder="Colors" formControlName="selectedColors" multiple&gt;
     &lt;mat-option *ngFor="let color of allColors" value="{{color}}"&gt;{{color}}&lt;/mat-option&gt;
  &lt;/mat-select&gt;
  </code></pre>
  
  <p>This works just fine. In my dialog's TS file, I have the following arrays declared:</p>
  
  <pre><code>this.allColors =  ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];
  this.defaultSelections = ['red', 'green', 'blue'];
  </code></pre>
  
  <p>Note the 2nd array, "defaultSelections": I want to have these items pre-selected when the dialog is displayed. I can't seem to find / figure out how to do this. </p>
  
  <p>Thank you in advance for the help!</p>