我这样做
<div class="tiles" ng-repeat="stat in states" ng-click="select(stat)" ng-class="{active: isActive(stat)}">
....
</div>
//控制器
$scope.select= function(item) {
$scope.selected = item;
};
$scope.isActive = function(item) {
return $scope.selected === item;
};
点击瓷砖,它正在添加活动类,然后点击从第一个瓷砖中移除的其他瓷砖并添加到另一个瓷砖。它正在按预期工作。但我想要实现的是再次点击相同的瓷砖我必须删除活动类,再次点击我必须添加像切换。但不知道如何实现这一点。请帮助
答案 0 :(得分:3)
更新您的select函数,将selected
属性设置为null
(如果已选中):
$scope.select = function(item) {
$scope.selected = ($scope.selected === item ? null : item);
};
JSFiddle示例
<强> http://jsfiddle.net/bATZ5/ 强>
答案 1 :(得分:2)
只需将您的代码更改为:
$scope.select= function(item) {
if (item === $scope.selected) {
$scope.selected = null;
} else {
$scope.selected = item;
}
};