【发布时间】:2026-01-26 23:55:01
【问题描述】:
我在定义特定类做动态元素时遇到了一些麻烦,看看这个 JSON:
filterData = {
"highlights": {
"title": "Destaques",
"options": [{
"id": 1,
"title": "Outlet",
"alias": "outlet",
"counter": 3,
"classes": ["outlet", "feb", "jun"]
}, {
"id": 2,
"title": "Novidades",
"alias": "news",
"counter": 0,
"classes": ["news", "may"]
}, {
"id": 3,
"title": "Promoção",
"alias": "promo",
"counter": 1,
"classes": ["promo"]
}]
}
}
每个按钮都有自己的 selected 类,这取决于它是否被用户选中:
<div
*ngIf="filterEnabled"
class="filters_btns"
>
<button
*ngFor="let item of filtersList.options"
type="button"
class="btn"
(click)="toggleFilterOption(item)"
[ngClass]="{ 'selected': filterData[item.id]" <-- also add all of the classes of this array (item.classes) if some exists
>{{ item.title }}</button>
</div>
有什么方法可以做到这一点?添加一个类数组(如果存在的话),同时根据filterData[item.id]添加'selected'类 (布尔值)
【问题讨论】:
标签: angular typescript ng-class ngfor