title: Multiple Toggle button default selected values in Angular 7
body: <p>I'm looking to instantiate the default values for a mat-toggle-button-group. For some reason whenever the multiple attribute is used, the values are not set like it should. </p>
  
  <p>For a single default value in a toggle-group without multiple attribute, there is no problem. And I thought it would work the same way, but apparently it doesn't. 
  My code looks like this : </p>
  
  <p>Main html.component where I use the form with an Input</p>
  
  <pre><code>    &lt;app-customer-form [customer]="updateCustomer"&gt;&lt;/app-customer-form&gt;
  </code></pre>
  
  <p>inside the form is a part with a toggle button for the companies that are related to the customer:</p>
  
  <pre><code>    &lt;mat-button-toggle-group  #groupCompany="matButtonToggleGroup" 
               multiple="true"
               [value]="selectedCompanies"
               (change)="onValueChange(groupCompany.value)" 
               &gt;
               &lt;mat-button-toggle *ngFor="let item of companyList" 
           [value]="item"&gt;{{item?.name}}&lt;/mat-button-toggle&gt;
      &lt;/mat-button-toggle-group&gt;
  </code></pre>
  
  <p>in the ts file I'm retrieving the companies inside my object and storing the values inside the array/object selectedCompanies. The companyList is retrieved and works fine. I checked with the console.log and the selectedCompanies is instantiated like expected and contains the correct values. But the toggle buttons are not selected. </p>
  
  <p>It is kind of hard to put the ts.file in here because it is really nested with other components. But in short it looks like this. When a row in the table component is clicked, it emits an event to the parent component with the value of the customer, and inside the object there is the property of companies. The emitted value is used to fill the form with the toggle button. </p>
  
  <p>form.ts file :</p>
  
  <pre><code>export class FormComponent implements OnInit, OnChanges {
  @Input() customer : ICustomer; 
  companyList: ICompany[];
  selectedCompanies: ICompany[];
  constructor( 
      private companyService : CompanyService,
      public sharedService : SharedServices
      ) {}
  ngOnInit(){
  this.instantiateForm(); // retreives the values for the companyList and 
                          // other default values.
  }
  ngOnChanges() {
  this.setSelectedCompanies();
  }
  setSelectedCompanies(){
  this.selectedCompanies = this.customer.companies
  }
  </code></pre>
  
  <p>Anyone any thoughts about this?
  Thanks for the help!</p>