Change class of element in ng-click of angularjs

Niju picture Niju · Mar 27, 2014 · Viewed 15.6k times · Source

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.

Answer

karaxuna picture karaxuna · Mar 27, 2014

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>