Change class of element in ng-click of angularjs
Asked Answered
S

3

5

I have html elements that created by ng:repeat . I need to change 'active' class in ng-click from all other elements and need to add class in that particular element where the event occoured.

<ul class="paginate">
   <li ng-repeat="value in pageList">
       <a ng-class="{active : $first, item : true}"  ng-click="clickedPage(value)">{{value}}</a>
  </li>
</ul>

Here first <a> has 'active' class. I need to remove 'active' class from <a> and need to add same class if i clicked in <a> that has no 'active' class.

Samuelson answered 27/3, 2014 at 6:17 Comment(0)
P
8

Try like this:

$scope.activeValue;
$scope.clickedPage = function(value){
    $scope.activeValue = value;
    // other oeprations
};

html:

<a ng-class="{active : activeValue === value}"  ng-click="clickedPage(value)">
    {{value}}
</a>
Proverb answered 27/3, 2014 at 6:33 Comment(0)
A
2

I only change/remove the class:

 function removeClass() {
                var element = angular.element('#nameInput');
      element.removeClass('nameClass');
 };
Andean answered 22/5, 2015 at 8:23 Comment(0)
M
0

    filter('addclass',function(){
    return function(activeValue,value){
        if(activeValue==value)
           return "active";
        else
           return "";
    }
    });
<a class="{{activeValue|activeValue:value}}"  ng-click="clickedPage(value)">
        {{value}}
</a>
Mckissick answered 16/2, 2015 at 12:33 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.