如果我使用ui-sref ="&quot ;?如何将活动类设置为菜单？ [英] How to set active class to menu if I am using ui-sref=""?

问题描述

<ul class="main-menu" id="main-menu">
        <li class="main-menu__item active" ui-sref="home">
            <a href="">
                <div class="title">DASHBOARD</div>
            </a>
        </li>

        <li class="main-menu__item" ui-sref="settings">
            <a href="">
                <div class="title">CONFIGURACIÓN</div>
            </a>
        </li>
</ul>

<pre lang="CSS">
.main-menu__item a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 55px;
    padding-left: 20px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #eaeaea;
    cursor: pointer;
}
.main-menu__item.active a .title {
    color: #f49e00;
}

我的尝试：

What I have tried:

$('li.main-menu__item').click(function(){
    $('li.main-menu__item').removeClass("active");
    $(this).addClass(" active");
});

It is working fine but only when i click second time to the same menuitem, first time when i clicks on the link, active class is added but only for second.
is there any other way to solve this using angularjs or jquery? please suggest.
thanks in adv.

推荐答案

（'li.main-menu__item'）。click（function（）{

('li.main-menu__item').click(function(){

（'li.main-menu__item'）。removeClass（active）;

('li.main-menu__item').removeClass("active");

（this）.addClass（active）;
}）;

(this).addClass(" active"); });

It is working fine but only when i click second time to the same menuitem, first time when i clicks on the link, active class is added but only for second.
is there any other way to solve this using angularjs or jquery? please suggest.
thanks in adv.

这篇关于如果我使用ui-sref ="&quot ;?如何将活动类设置为菜单？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！