title: Getting list of selected values from Angular 6 mat-selection-list
body: <p>How do I get the list of all values selected from Angular material <a href="https://material.angular.io/components/list/api#MatSelectionList" rel="noreferrer">mat selection list</a> in the component. The example given shows values to be displayed in the template but not in component. I am trying to modify the solution given in <a href="https://stackoverflow.com/questions/50636365/current-selected-value-in-angular6-material-mat-selection-list/50636719">this question</a> but its not working for me. Here is my current code:</p>
  
  <p>Template:</p>
  
  <pre><code>&lt;mat-selection-list #selected [(ngModel)]="readingTypesSelected" (ngModelChange)="onSelection($event)" &gt;
    &lt;mat-list-option *ngFor="let readingType of readingTypes"&gt;
      {{readingType.name}}
    &lt;/mat-list-option&gt;
  &lt;/mat-selection-list&gt;
  </code></pre>
  
  <p>Component:</p>
  
  <pre><code>    onSelection(e, v) {
  
      console.log(e);
      console.log(v);    
    }
  </code></pre>
  
  <p>The following is getting logged to console:</p>
  
  <p><a href="https://i.stack.imgur.com/npSm2.png" rel="noreferrer"><img src="https://i.stack.imgur.com/npSm2.png" alt="enter image description here"></a></p>
  
  <p>How do i extract actual values of selected options from this?</p>
  
  <p><strong>Solution</strong>:</p>
  
  <p>The first two lines of template code should be (as given in stackblitz link in accepted solution):</p>
  
  <pre><code>&lt;mat-selection-list #selected (selectionChange)="onSelection($event, selected.selectedOptions.selected)" &gt;
        &lt;mat-list-option *ngFor="let readingType of readingTypes" [value] ="readingType"&gt;
  </code></pre>