title: Why Angular Material compareWith function only compares first value?
body: <p><strong>Object from API:</strong></p>
  
  <pre><code>roles = {
      admin: false,
      user: true,
  }
  </code></pre>
  
  <p><strong>Template:</strong></p>
  
  <pre><code>&lt;mat-select formControlName="roles" required multiple [compareWith]="compareRoles"&gt;
      &lt;mat-option *ngFor="let role of roleList" [value]="role"&gt;{{role}}&lt;/mat-option&gt;
  &lt;/mat-select&gt;
  </code></pre>
  
  <p>Component:</p>
  
  <pre><code>this.roles = ['admin', 'user']
  
  createForm(): FormGroup
  {
      return this._formBuilder.group({
          roles : [[this.roles]],
      })
  }
  </code></pre>
  
  <p>compareWith function:</p>
  
  <pre><code>public compareRoles(c1: any, c2: any): boolean {
      return true
  }
  </code></pre>
  
  <hr>
  
  <p><strong>Expected behavior with compareWith function always returning true:</strong> Both 'admin' and 'user' should be checked.</p>
  
  <p><strong>Actual behavior:</strong> Only 'admin' is checked. Function does not execute check for 'user'.</p>
  
  <p>Why is only the first value in my roles array being compared? Also, why isn't both 'admin' and 'user' checked when the compareWith function always returns true?</p>