在表中的行上使用 ng-repeat 和 ng-class [英] Using ng-repeat and ng-class on rows inside a table

问题描述

我正在使用 AngularJS，并且我想要获得的效果与这会产生的效果类似，假设它可以工作(但它不起作用).

I am using AngularJS and the effect I want to get would be something similar to what this would produce, assuming it would work (which it doesn't).

查看

<tr ng-repeat='person in people' ng-class='rowClass(person)'>
  <td>.....info about person...</td>
  <td>.....info about person...</td>
  <td>.....info about person...</td>
</tr>

控制器

$scope.rowClass = function(person){
  ...return some value based upon some property of person...
}

我意识到这段代码不起作用，因为 person 对 ng-class 不可用，因为它只对每一行内的对象可用.代码是为了了解我正在尝试做的事情:即.我希望能够拥有使用 ng-repeat 创建的表行，其类也基于依赖于对行本身的作用域特征的访问的条件，例如.人.我意识到我可以只是在列上添加 ng-class 但这很无聊.有人有更好的想法吗?

I realise that this code won't work because person is unavailable to ng-class as it will only be available to objects inside each row. The code is to get the idea of what I'm trying to do across: ie. I want to be able to have table rows that are created using ng-repeat whose class is also based on a condition which depends on access to the scoped feature of row itself eg. person. I realise I could just add ng-class on the columns but that is boring. Anyone have any better ideas?

推荐答案

这实际上应该可以正常工作.Person 应该在 tr 元素及其子元素上可用，因为它们共享相同的作用域.

This should actually work fine. Person should be available on the tr element as well as on its children since they share the same scope.

这对我来说似乎很好:

<table>
    <tr ng-repeat="person in people" ng-class="rowClass(person)">
        <td>{{ person.name }}</td>
    </tr>
</table>

http://jsfiddle.net/xEyJZ/

这篇关于在表中的行上使用 ng-repeat 和 ng-class的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！