更改特定列的样式

Question

我有一个包含动态创建列的表的声明：

<table>
  <tr ng-repeat="row in rows">
      <td ng-class="{ 'tdhead' : $index == 0 }" 
                   ng-repeat="col in row.cols">{{col.val}}</td>     
  </tr>
</table>

在示例中，ng-class取决于row变量，它会更改第一行中的所有td类。但我还需要更改特定列中的td类。有没有办法实现这个目标？

Answer 1

希望这有助于在ng-class

中添加以下条件

ng-class="{ 'tdhead' : $index == 0 && $parent.$index == 1 }" 

var app = angular.module('plunker', []);
app.controller('MainCtrl',
  function MainCtrl($scope) {



    $scope.rows = [{
      name: "abc1",
      empid: 10215,
      cols: ["heading1", "heading2", "heading3"]
    }, {
      name: "abc2",
      empid: 10216,
      cols: ["heading1", "heading2", "heading3"]
    }, {
      name: "abc3",
      empid: 10217,
      cols: ["heading1", "heading2", "heading3"]
    }, {
      name: "abc4",
      empid: 10218,
      cols: ["heading1", "heading2", "heading3"]
    }, {
      name: "abc5",
      empid: 10219,
      cols: ["heading1", "heading2", "heading3"]
    }];




  }
);

.tdhead {
  background-color: red;
}

<script data-require="angularjs@1.5.8" data-semver="1.5.8" src="https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script>
<table ng-app="plunker" ng-controller="MainCtrl">
  <tr ng-repeat="row in rows track by $index">
    <td ng-class="{ 'tdhead' : $index == 1 && $parent.$index == 3 }" ng-repeat="col in row.cols">{{col}}</td>
  </tr>
</table>