Как получить доступ к опциям выбора в mat-selection-list материала

У меня была та же проблема с nltk 3.0.01b. Я загрузил пакет «книга» и отслеживал загрузку с сетевого экрана диспетчера задач, одновременно проверяя размер целевой папки (AppData\roaming\nltk_data в моей системе Windows 7). Сетевой трафик прекратился, и папка перестала расти с размером 379 МБ. Но оболочка Python была заблокирована. Следующее появилось следующее сообщение:

, отображающее информацию http://nltk.github.com/nltk_data/

blockquote>

Однако, если вы отмените окно Tk, показывающее, какие элементы загрузки доступны, команда nltk.download() завершится, и приглашение оболочки вернется.

0
задан Matthias 17 January 2019 в 14:49
поделиться

2 ответа

Ну, кажется, что правильный путь - использовать свойство selectedOptions объекта MatSelectionList.

selectedOptions: SelectionModel<MatListOption>

В вашем примере вы получаете доступ к частной собственности.
Вы можете проверить источники SelectionModel, чтобы увидеть, что вы можете использовать.

Правильный метод, по-видимому,

/** Selected values. */
get selected(): T[] {
  if (!this._selected) {
    this._selected = Array.from(this._selection.values());
  }

  return this._selected;
}

Событие напечатано как MatSelectionListChange, поэтому:

onPizzasChange(event: MatSelectionListChange) {
    console.log("selectedOptions:", event.source.selectedOptions.selected();
};

Кстати, пара названий пиццы неверна: Margherita и Quattro Stagioni.

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

0
ответ дан LppEdd 17 January 2019 в 14:49
поделиться

Начните с добавления value для строк или ngValue для объектов к вашим опциям.

<mat-list-option *ngFor="let pizza of pizzas" [value]="pizza"> or [ngValue]="pizza"

1. Используйте selectionChange

Передайте массив выбранных MatListOptions вашей функции.

<mat-selection-list #pizzaList (selectionChange)="onGroupsChange(pizzaList.selectedOptions.selected)">
    <mat-list-option *ngFor="let pizza of pizzas" [value]="pizza">
        {{pizza}}
    </mat-list-option>
</mat-selection-list>

Вы получите массив, который содержит выбранные параметры в том порядке, в котором они были выбраны.

import { MatListOption } from '@angular/material'

onGroupsChange(options: MatListOption[]) {
  // map these MatListOptions to their values
  console.log(options.map(o => o.value));
}
<час>

2. Используйте ngModel

Как прокомментировал @Eliseo, вы можете использовать ngModel для двухсторонней привязки данных, если вы хотите получить доступ только к выбранным данным, но не должны получать уведомления об изменениях.

<mat-selection-list #pizzaList [(ngModel)]="selectedPizzas">
    <mat-list-option *ngFor="let pizza of pizzas" [value]="pizza">
        {{pizza}}
    </mat-list-option>
</mat-selection-list>
selectedPizzas: string[]; // this array will contain the selected pizzas

Чтобы дополнительно получать уведомления об изменениях, вы можете добавить ngModelChange:

<mat-selection-list #pizzaList [(ngModel)]="selectedPizzas" (ngModelChange)="onGroupsChange($event)">

Вы получите массив, содержащий значения выбранных опций в порядке их появления в входной массив pizzas (не в том порядке, в котором они были выбраны, как в selectionChange).

onGroupsChange(selectedPizzas: string[]) {
  console.log(selectedPizzas);
}
0
ответ дан fridoo 17 January 2019 в 14:49
поделиться
Другие вопросы по тегам:

Похожие вопросы: