Este es el código html para los botones, taskfilter es el filtro de cómo funcionan los botones al hacer clic y el nombre de la clase es 'sel'

<a class="clear-completed" ng-click="taskfilter = 1" ng-class="{'sel':enabled}">
  <span>show completed</span>.
</a>
<a class="clear-completed" ng-click="taskfilter = 2" ng-class="{'sel':enabled}">
  <span>show to do</span>.
</a>
<a class="clear-completed" ng-click="taskfilter = 0" ng-class="{'sel':enabled}">
  <span>show all</span>.
</a>  

Este es el código que utilicé para agregar el alcance de la clase con el botón al hacer clic en eliminar el índice en html porque no funcionará

$scope.taskfilters = 0;
$scope.taskfilter = function(index) {
    $scope.taskfilters = index;
};
1
amir hanif 13 ene. 2017 a las 13:45

4 respuestas

La mejor respuesta
<a class="clear-completed" ng-click="taskfilters = 1" ng-class="{'sel':taskfilters == 1}">
     <span>show completed</span>.
</a>
<a class="clear-completed" ng-click="taskfilters = 2" ng-class="{'sel':taskfilters} == 2">
     <span>show to do</span>.
</a>
<a class="clear-completed" ng-init="taskfilters = 0" ng-click="taskfilters = 0" ng-class="{'sel':taskfilters == 0}">
     <span>show all</span>.
</a>
1
Ankit Vadi 13 ene. 2017 a las 11:42
<a class="clear-completed" ng-click="taskfilters = 1" ng-class="{'sel':taskfilters == 1}">
     <span>show completed</span>.
</a>
<a class="clear-completed" ng-click="taskfilters = 2" ng-class="{'sel':taskfilters} == 2">
     <span>show to do</span>.
</a>
<a class="clear-completed" ng-click="taskfilters = 0" ng-class="{'text-primary':!taskfilters, 'sel':taskfilters == 0}">
     <span>show all</span>.
</a>
1
Manikandan Velayutham 13 ene. 2017 a las 13:01

Puede usar la directiva ngClass

Si la expresión se evalúa como un objeto, entonces para cada par clave-valor del objeto con un valor truthy, el key correspondiente se usa como class name.

<a ng-class="{'active' : taskfilter == 0}" ng-click="taskfilter = 0">
1
Satpal 13 ene. 2017 a las 10:49
var app = angular.module("ap",[]);

app.controller("con",function($scope) {

$scope.class = "red";
$scope.changeClass = function(){
if ($scope.class === "red")
  $scope.class = "blue";
else
  $scope.class = "red";
};

});

.red{
 color:red;
 }

  .blue{
  color:blue;
 }
0
Coder 13 ene. 2017 a las 10:56