angular - 在 *ngFor 循环中有条件地将 CSS 规则应用到元素上
我有一个动态填充对象的列表。
我想实现给包含被选中复选框的 div 添加背景颜色。
此外,我想在复选框被选中时显示按钮。
<div *ngFor="let item of items" [ngClass]="classname: ifCheckboxChecked">
<p-checkbox (onChange)="onCheckboxChecked($event)"></p-checkbox>
<span>{{item.itemName}}</span>
<div *ngIf="ifCheckboxChecked">
<button></button>
<button></button>
</div>
</div>
答案#1
最好的方法是将这个“isChecked”属性添加到你的项目模型中。代码可能看起来像这样:
<div *ngFor="let item of items" [class.classname]="item.isChecked">
<p-checkbox [(value)]="item.isChecked"></p-checkbox>
<span>{{item.itemName}}</span>
<div *ngIf="item.isChecked">
<button></button>
<button></button>
</div>
</div>
