添加类的父元素上点击 [英] Add class to parent element on click
问题描述
我有以下code:
<李班=parentElement>
< UL>
<李班=亮点>< A HREF =>项目1 LT; / A>< /李>
<立GT;< A HREF =>项目2'; / A>< /李>
<立GT;< A HREF =>项目3'; / A>< /李>
< / UL>
< /李>
< UL>
这里是导航菜单下拉。有源元件/ <立GT;
有一流的亮点...
我需要添加类主动到parentElement上课时的亮点是在列表中的元素之一。
我试图用纳克级,但没有成功。
更新
纳克级={'积极':hasHighlight}会不会与我的code工作,这将增加ACTIV作为永久的亮点是present在纳克级的所有时间:
<李班=parentElement>
< A HREF =#类=下拉菜单,切换数据切换=下拉菜单>< / A>
< UL类=下拉菜单>
<李纳克级={亮点:isActive('/ ITEM1')}>< A HREF =$ {建立连结(URI:'/#/ ITEM1')}>< / A> < /李>
<李纳克级={亮点:isActive('/ ITEM2')}>< A HREF =$ {建立连结(URI:'/#/ ITEM2')}>< / A> < /李>
<李纳克级={亮点:isActive('/项目3')}>< A HREF =$ {建立连结(URI:'/#/项目3')}>< / A> < /李>
< / UL>
< /李>
您说得对,使用纳克级
。
<李班=parentElementNG-CLASS ={'积极':hasHighlight}>
< UL>
<李班=亮点>< A HREF =>项目1 LT; / A>< /李>
<立GT;< A HREF =>项目2'; / A>< /李>
<立GT;< A HREF =>项目3'; / A>< /李>
< / UL>
< /李>
在你的控制器,只要你的类高亮
添加到列表中的元素,将 $ scope.hasHighlight
来等于真正
。当它的起飞,将其更改为假
。
I have following code:
<li class="parentElement">
<ul>
<li class="highlight"><a href="">Item 1</a></li>
<li><a href="">Item 2</a></li>
<li><a href="">Item 3</a></li>
</ul>
</li>
<ul>
in here is a dropdown in navigation menu. Active element/<li>
have class highlight...
I need to add class active to parentElement when class highlight is in one of the list element.
I was trying to use ng-class but without success.
UPDATE
ng-class="{'active': hasHighlight}" will not work with my code, it will add activ permanently as highlight is present all time in ng-class:
<li class="parentElement">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"></a>
<ul class="dropdown-menu">
<li ng-class="{ highlight: isActive('/item1')}"><a href="${createLink(uri: '/#/item1')}"></a></li>
<li ng-class="{ highlight: isActive('/item2')}"><a href="${createLink(uri: '/#/item2')}"></a></li>
<li ng-class="{ highlight: isActive('/item3')}"><a href="${createLink(uri: '/#/item3')}"></a></li>
</ul>
</li>
You were right about using ng-class
.
<li class="parentElement" ng-class="{'active': hasHighlight}">
<ul>
<li class="highlight"><a href="">Item 1</a></li>
<li><a href="">Item 2</a></li>
<li><a href="">Item 3</a></li>
</ul>
</li>
In your controller, whenever you add the class highlight
to the list element, change $scope.hasHighlight
to equal true
. When it's taken off, change it to false
.
这篇关于添加类的父元素上点击的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!