My ng-class is adding an 'active' class but not removing



I have a ng-repeat with a ng-class, to make the meny active when clicked. It adds the class ‘active’ to the selected menu, but the problem is that this keeping adding the active class to all menus I click and doesn’t remove the previous selected menu.

Here’s my JS:

$scope.getCategory = function(item) {
        $scope.selected =;

	$scope.isActive = function(item) {
		return $scope.selected ===;

Here’s the Html:

<li ng-repeat="category in categories" ng-controller="CategoryController">
  	<a ng-click="getCategory(category)" ng-class="{active:isActive(category)}">{{}}</a>

Does someone know why is this happening? Thanks a lot


Can you reproduce this in a codepen? I made a codepen with a few things changed but the same concept and it’s working:


I’ll try to modify my code again, thanks for the answer.


Thanks @brandyshea I found the issue, I was using two controllers in my list and using $ instead of :smile:


Glad you got it working. :smile:


Your codepen was very usefull :slight_smile: !