本文介绍了在ngFor中提供活动类onclick on angular 2的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

您好,我的清单是无序的,所有的人都有活动的课堂.我想在单击任何列表项时切换活动班级.我的代码是这样的

Hi I have unordered list and all of them have active class. I want to toggle active class when clicked to any list item. My code is like this

<ul class="sub_modules">
  <li *ngFor="let subModule of subModules" class="active">
    <a>{{ subModule.name }}</a>
  </li>
</ul>

有人可以帮助我做到这一点吗?

can anyone help me to do this?

推荐答案

您可以执行以下操作:

<ul class="sub_modules">
  <li (click)="activateClass(subModule)"
      *ngFor="let subModule of subModules"
      [ngClass]="{'active': subModule.active}">
    <a>{{ subModule.name }}</a>
  </li>
</ul>

在组件上

activateClass(subModule){
  subModule.active = !subModule.active;    
}

在Ng类中,第一个属性是您要添加的类,第二个属性是条件;

On the Ng class the first property is the class you wanna add and the second is the condition;

这篇关于在ngFor中提供活动类onclick on angular 2的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-24 16:39