title: Angular Material: mat-select default value when using reactive forms
body: <p>I created a form using reactive forms and angular material <strong>mat-select</strong> which I use to create an object called "<strong>core</strong>". The core object has 2 properties: "name" and "owners". The "owners" property is an array of <strong>IUser</strong> objects.</p>
  
  <p>The core object:</p>
  
  <pre><code>export interface ICore {
    id?: number;
    name: string;
    owners: IUser[];
  }
  </code></pre>
  
  <p>The form:</p>
  
  <pre><code>&lt;form [formGroup]="parentForm"&gt;
        &lt;mat-form-field class="example-full-width"&gt;
          &lt;input matInput formControlName="name" placeholder="Name"&gt;
        &lt;/mat-form-field&gt;
  
        &lt;mat-form-field class="example-full-width"&gt;
          &lt;mat-label&gt;Users&lt;/mat-label&gt;
          &lt;mat-select formControlName="owners" multiple&gt;
            &lt;mat-option *ngFor="let user of users" [value]="user"&gt; {{ user.username }}&lt;/mat-option&gt;
          &lt;/mat-select&gt;
        &lt;/mat-form-field&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>The "<strong>users</strong>" variable is an array of all available users that can be selected.</p>
  
  <pre><code> users: IUser[];
  </code></pre>
  
  <p>The form works great but now I want to use the same form to edit a core object and for that I need to display the core owners in the "owners" form control when the page is loaded.</p>
  
  <p>Form creation:</p>
  
  <pre><code>  createForm() {
      this.coreForm = this.formBuilder.group({
        name: ['', [Validators.required]],
        owners: ['', [Validators.required]]
      });
    }
  </code></pre>
  
  <p>How I get the core:</p>
  
  <pre><code>getCore() {
      this.coreService.getCore(this.route.snapshot.params['id'])
        .subscribe(
          res =&gt; {
            this.core = res;
            this.updateForm();
          },
          err =&gt; this.toastr.error('Core has not been received!', 'Error!')
        );
    }
  </code></pre>
  
  <p>Form update(it works for the name property):</p>
  
  <pre><code>  updateForm() {
          this.coreForm.patchValue({
            name: this.core.name,
            owners: this.core.owners
          });
        }
  </code></pre>
  
  <p>But the owners list is not added. The strange thing is that if I update the form with the <strong>users</strong> it works:</p>
  
  <pre><code>  getUsers() {
      this.usersService.getUsers()
      .subscribe(
        res =&gt; {
          this.users = res;
          this.coreForm.patchValue({
            owners: res
          });
        },
        err =&gt; this.toastr.error('User could not be received!', 'Error!')
      );
    }
  </code></pre>
  
  <p>This way all the users are added as the default value. But for the core owners it's not working. Any idea what I do wrong here?</p>
  
  <p>Thanks in advance!</p>