Я создал диалог со списком опций (пользователей), которые можно выбрать с помощью mat-selection-list. У меня есть случай использования, когда я должен отключить список уже выбранных пользователей от повторного выбора / щелчка.
Итак, я получаю выбранных пользователей из события, добавляю флаг, чтобы узнать, был ли пользователь уже выбран или нет, и отключаю mat-list-option на основе возвращенного логического значения из флага, который у меня есть. Вот код для этого.
<mat-selection-list
#listItem
(selectionChange) = "handleSelection($event, listItem.selectedOptions)">
<mat-list-option
*ngFor = "let item of filteredArray"
[value] = "item"
[disabled] = "item.isSelected">
{{getDisplayValue(item)}}
<mat-divider></mat-divider>
</mat-list-option>
</mat-selection-list>
Теперь проблема в том, что я хочу также поставить галочку для уже выбранных пользователей, поскольку mat-list-option имеет дочерний элемент mat-checkbox.
Поэтому, когда я отключаю mat-list-option (родительский), он также добавляет класс mat-psuedo-checkbox-disabled к флажку (дочерний элемент). Я хочу, чтобы этого не произошло.
Или предложите мне эффективный способ переопределить класс mat-checkbox и добавить к нему класс checked, даже если mat-list-option отключил класс, добавленный к нему.
Любая помощь приветствуется, спасибо.
ОБНОВИТЬ: Решил это, добавив к этому свойство mat-list-option selected. Как глупо было упустить это.
Конечно, сейчас я не в состоянии это сделать. Возможно, я смогу это сделать к завтрашнему утру. Извините.






<mat-list-option *ngFor = "let item of filteredArray" [value] = "item" [disabled] = "item.isSelected" [selected] = "item.isSelected">
Смог решить эту проблему с помощью моего коллеги.
я смотрел не в том месте.
Возможно ли создать образец StackBlitz, воспроизводящий эту проблему?