我有一个使用ngFor循环的div,现在每当我单击循环中的一个div时,我想要更改该特定div的文本颜色,然后在此之后如果我单击循环中的任何其他div,那个div只会改变他的颜色,之前点击的div会将其文本颜色改为初始值。 [仅使用Angular 2]。
例如:
<div *ngFor="let x of y; let i= index" (click)="changeColor()"></div>
答案 0 :(得分:3)
解决问题的方法如下:
将模板代码更改为以下内容:
[ngClass]
请注意,我添加了changeColor(i)
并将其与条件绑定。另请注意,索引已传递到public selectedIndex;
changeColor(i){
this.selectedIndex = i;
}
现在在您的组件类中:
.selected-color{
background-color: red;
}
根据需要定义背景颜色的css类:
public class ReceptionService:IReceptionService
{
private readonly DataContext _ctx;
private readonly IAutomotiveRepository _automotiveRepository;
private readonly IReferredRepository _referredRepository;
private readonly IReceptionRepository _receptionRepository;
private readonly IReceptionService _receptionService;
private readonly IAutomotiveService _automotiveService;
private readonly IReferredService _referredService;
public ReceptionService(DataContext ctx, IReferredRepository ReferredRepository, IAutomotiveRepository AutomotiveRepository,IReceptionRepository ReceptionRepository,IReceptionService ReceptionService,IReferredService ReferredService,IAutomotiveService AutomotiveService)
{
_ctx = ctx;
_automotiveRepository = AutomotiveRepository;
_referredRepository = ReferredRepository;
_receptionRepository = ReceptionRepository;
_referredService = ReferredService;
_automotiveService = AutomotiveService;
_receptionService = ReceptionService;
}
}
现在一切都应该正常工作。