在 Angular 中添加和删除类

Question

我想在单击时为 li 元素添加背景颜色，但是当我单击另一个 li 元素时，先前的 li 元素背景颜色保持不变。

组件.html

 <div class="col-md-3 categories">
  <h3>News By Type</h3>
  <ul>
    <li class="cat" id="cat_{{i}}" *ngFor="let category of categories; let i = index" (click)="sortNewsItems($event,category,i)"><img src="../assets/images/news.jpg" width="70"><h4>{{category}}</h4></li>
  </ul>
</div>

组件.ts

 sortNewsItems(event,cat,index) {
  event.target.classList.add('cat_active');
}

原文由 Bhaskararao Gummidi 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您应该使用 srcElement 的 $event

 sortNewsItems(event,cat,index) {
  event.srcElement.classList.add('cat_active');
}

阅读此 答案 并使用其演示

原文由 Aravind 发布，翻译遵循 CC BY-SA 3.0 许可协议