#angular #multi-select #dynamic-list
#angular #множественный выбор #динамический список
Вопрос:
<div class="col-4" style="display: block; padding-top: 10px;">
<div class="list-group" id="listDetails" *ngFor="let filter of filters">
<a class="list-group-item list-group-item-action" (click)='SelectedItem($event, filter)'
style="border-style: hidden;" id="list-home-list">
<div class="container">
<div class="row">
<img width="30" height="30" src={{filter.FilterImage}}>
<span
style="padding: 2px; margin-left: 1px; margin-right: 10px;">{{filter.FilterDiasplayName}}</span>
<div class='col d-flex justify-content-end'>
<span class="badge">{{filter.FilterValue}}</span>
</div>
</div>
</div>
</a>
</div>
</div>
Как добиться многовыборной опции в этом случае? Список является динамическим. При выборе все выбранные строки должны стать активными.
Ответ №1:
Если вы просто хотите выделить выбранный элемент, возможно, вам следует добавить класс и изменить их класс?
<a class="list-group-item list-group-item-action {{ itemClass }}"...................
и добавьте класс к элементу, например, active, затем в ваш css
.active{ coloring... }
и в вашей функции щелчка обрабатывается класс элемента