angularjs - add active class to menu item clicked add remove from others -

i want add isactive class item menu when user click on item, , remove isactive class others items. trying compare id, angularjs code:

$rootscope.isactive = function(idval, event){          return idval === event.target.id;     }  

this part menu html code:

 <ul class="sidebar-nav">          <li>             <a ui-sref="" id='101' ng-class="{active: isactive($event, 101)}">                 <span class='glyphicon  glyphicon-ban-circle glyph-sidebar'></span>                  rules             </a>             <ul class='dropdown sidebar-nav-dropdown' >                 <li>                     <a href="">transaction mapping</a>                 </li>                 <li>                     <a href="">file setup</a>                 </li>                 <li>                      <a href="">code setup</a>                 </li>                </ul>         </li>         <li>             <a href="#" id='102' ng-class="{active: isactive($event, 102)}">                 <span class='glyphicon  glyphicon-ban-circle glyph-sidebar'></span>                 administrative rules             </a>             <ul class='dropdown sidebar-nav-dropdown'>                 <li>                     <a ui-sref="admin.mapping-rules">transaction mapping</a>                 </li>                 <li>                     <a ui-sref="admin.mapping-rules">file setup</a>                 </li>                 <li>                     <a ui-sref="admin.mapping-rules">code setup</a>                 </li>             </ul>         </li>      </ul>  

thanks,

first of all, shouldn't use root scope. should use scope of controller associated view.

second, code doesn't make sense. $event can used parameter of function called... react event:

ng-click="dosomething($event)" 

but ng-class, there no $event.

all need have in scope id (or name, or whatever identifies menu item) of selected menu item:

$scope.selectedmenuitem = null; 

when item clicked, need change selected menu item:

ng-click="selectmenuitem(101)"  $scope.selectmenuitem(item) {     $scope.selectedmenuitem = item; } 

then associated css class selected menu item, need

ng-class="{active: selectedmenuitem === 101}" 

that said, if links navigate given router state, don't need selectedmenuitem. need add active class if current router state 1 link allows navigating (assuming $state on scope):

ng-class="{active: $state.includes('admin.mapping-rules')}