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

ionic-v1
1

Hello,

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 = item.name;

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

Here’s the Html:

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

Does someone know why is this happening? Thanks a lot

2

Can you reproduce this in a codepen? I made a codepen with a few things changed but the same concept and it’s working: http://codepen.io/brandyshea/pen/EjwbdP?editors=101

1 Like
3

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

4

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

5

Glad you got it working. :smile:

6

Your codepen was very usefull :slight_smile: !