Using ng-repeat and ng-class on rows inside a table

Question

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).

View

<         


        

Answer 1

Actually, you can use "person" in the context you are referring to. It exists on the item being repeated as well as any items within it. The reason is that any directives on a particular element share the same $scope object. ng-repeat has a Priority of 1000, so it has already created its $scope and put "person" into it, therefore "person" is available to ng-class.

See this Plnkr:

http://plnkr.co/edit/ZI5Pv24U01S9dNoDulh6

Answer 2

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.

This seems to work fine for me:

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

http://jsfiddle.net/xEyJZ/

Answer 3

Normally I like to give a more comprehensive answer but there is too much code involved in this bit to do that. So will just show what is most important and hope anyone looking at this knows how use it. My dynamic JSON array has both columns and rows in it but the main thing that matters for this bit is ng-show="$last". This should only show the last row in the dynamic JSON array.

<tr ng-repeat="row in table.rows" ng-show="$last">

   <td ng-repeat="column in table.cols" ng-show="column.visible == true" nowrap >{{row[column.columnname]}}</td>
</tr>