javascript - 如何在 ng-repeat 中添加类

Question

这是我的 Html 代码:

<div ng-controller="MainController">
  <ul class="list-holder">
     <li ng-repeat="check in checks" ng-class="{active : isSelected(check)}">
        <button ng-click="setcolor(check)">{{check.name}} </button> &nbsp;
        <button ng-click="setcolor(check)">{{check.name}} </button> &nbsp;
        <button ng-click="setcolor(check)">{{check.name}} </button> &nbsp;
        <hr>
    </li>
  </ul>
  <hr>
   {{selected | json}}
</div>

这是我的 Controller

function MainController($scope) {
    $scope.checks = [
       {name: 'sports'},
       {name: 'movies'},
       {name: 'Others'}
    ];

    $scope.setcolor = function(chk) {
       $scope.selected = chk;
    }

    $scope.isSelected = function(check) {
       return $scope.check === check;
    }
}

这是我的 CSS 文件

.active {
   background-color: red;
 }

我想使用切换功能在每一行中选择一个按钮。假设在第一行中选择了按钮 1，在第二行中选择了按钮 2，在第三行中选择了按钮 1。

Answer 1

看起来你在 isSelected 函数中有一点错误。您想与 $scope.selected 属性进行比较:

$scope.isSelected = function(check) {
    return $scope.selected === check;
}