Change class of element in ng-click of angularjs

Question

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 1

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>

Answer 2

I only change/remove the class:

 function removeClass() {
                var element = angular.element('#nameInput');
      element.removeClass('nameClass');
 };

Answer 3

    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>