Angular scrollable mat-selection-list?
Simple CSS
mat-selection-list {
max-height: 400px;
overflow: auto;
}
StackBlitz Demo
By setting custom CSS properties?
CSS for fancy scroll bar which only supports Chrome browsers:
.custom-scroll-bar{
height:70vh;
overflow-y:scroll;
overflow-x: hidden;
}
.custom-scroll-bar::-webkit-scrollbar{
width: 5px;
}
.custom-scroll-bar::-webkit-scrollbar-thumb{
background: rgba(0,0,0,.26);
}
For Firefox and Internet explorer just simply use:
.custom-scroll-bar{
height:70vh;
overflow-y:scroll;
}
HTML:
<mat-selection-list #shoes class="custom-scroll-bar">
<mat-list-option *ngFor="let shoe of typesOfShoes">
{{shoe}}
</mat-list-option>
</mat-selection-list>
StackBlitz Example