Получение списка выбранных значений из Angular 6 mat-selection-list

Question

Как получить список всех значений, выбранных из углового материала список выбора мата в компоненте.В приведенном примере показаны значения, которые должны отображаться в шаблоне, но не в компоненте.Я пытаюсь изменить решение, данное в этом вопросе , но оно не работает для меня.Вот мой текущий код:

Шаблон:

<mat-selection-list #selected [(ngModel)]="readingTypesSelected" (ngModelChange)="onSelection($event)" >
  <mat-list-option *ngFor="let readingType of readingTypes">
    {{readingType.name}}
  </mat-list-option>
</mat-selection-list>

Компонент:

    onSelection(e, v) {

    console.log(e);
    console.log(v);    
  }

В консоли регистрируется следующее:

Как извлечь из этого фактические значения выбранных параметров?

Решение :

Первые две строкикод шаблона должен быть (как указано в ссылке на стек в готовом решении):

<mat-selection-list #selected (selectionChange)="onSelection($event, selected.selectedOptions.selected)" >
      <mat-list-option *ngFor="let readingType of readingTypes" [value] ="readingType">

Answer 1

Попробуйте это

<mat-selection-list #list [(ngModel)]="selectedOptions" (ngModelChange)="onNgModelChange($event)">
    <mat-list-option *ngFor="let shoe of typesOfShoes" [value]="shoe">
      {{shoe}}
    </mat-list-option>
</mat-selection-list>

После связывания [(ngModel)]="selectedOptions" вы можете использовать переменную selectedOptions в вашем компоненте, которая будет иметь все выбранные элементы.

Пример: https://stackblitz.com/edit/angular-hdmfwi

Answer 2

Я обновил ваш код стекаблица здесь https://angular -selection.stackblitz.io

Теперь вы можете получать выбранные значения в консоли.