Список выбора материала без чекбокса, но элемент списка выделен - ищем, например,

Question

Я нашел пример списка выбора материала:

https://stackblitz.com/edit/material-selection-list-5-0-0-qhyxd5?file=app%2Fapp.component.html

Это довольно хорошо, но мне нужно сделать что-то вроде выделения, когда одна или несколько строк выбран. Во-первых, мне нужно скрыть флажок, а во-вторых, нужно стилизовать фон для выбранной строки. Кто-то знает, как, иметь знания о примере или может помочь мне ответить?

Answer 1

Чтобы скрыть флажки, просто используйте:

.mat-pseudo-checkbox{
  display: none !important;
}

Answer 2

Вы можете использовать ngClass для списка опций:

HTML:

[ngClass]="{'special-class': selectedOptions.includes(filter.value) }" 

CSS:

.special-class{
  background-color: red;  -- to set the background color
  pointer-events: none; -- to disable user clicks
}