三元不能用ng-class中的ng-repeat来处理单个div

时间:2015-09-16 21:07:35

标签: javascript html css angularjs

我正在尝试使用ng-click重复五次ng-click来改变div的颜色。它将类应用于div的所有五次迭代。

<div ng-repeat="item in items">
<div  ng-class="tileOn ? 'tile' : 'red-tile'"ng-click="itemClicked()"  ></div></div>

这是我处理变化的功能。

angular.module("GameApp",[]).controller('GameCtrl', function($scope){
    $scope.items = [{box:1},{box:1},{box:1},{box:1},{box:1}];

    $scope.itemClicked = function () {
         $scope.tileOn = !$scope.tileOn;
  };
})

1 个答案:

答案 0 :(得分:0)

尝试设置$scope.activeItem并在ng-class

中使用它
<div  ng-class="item==activeItem ? 'tile' : 'red-tile'" ng-click="itemClicked(item)"  ></div>

$scope.itemClicked = function(item){
   $scope.activeItem = item;
}