테이블 내의 행에서 ng-repeat 및 ng-class 사용

테이블 내의 행에서 ng-repeat 및 ng-class 사용

Angular를 사용하고 있습니다.JS와 내가 얻고 싶은 효과는 이것이 만들어 낼 수 있는 것과 비슷할 것이다. 만약 그것이 작동한다고 가정한다면(그렇지 않다).

보다

<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이 클래스는 행 자체의 스코프 기능에 대한 액세스에 따라 달라지는 조건에도 기초합니다(예: person컬럼에 ng-class를 추가할 수 있다는 것은 알고 있습니다만, 그것은 지루합니다.더 좋은 생각 있어요?

이거면 잘 될 거예요.사람은 동일한 범위를 공유하기 때문에 Tr 요소뿐만 아니라 Tr 요소에서도 이용할 수 있어야 한다.

이 방법은 잘 작동하는 것 같습니다.

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

http://jsfiddle.net/xEyJZ/

사실, 당신이 언급하는 문맥에서 "사람"을 사용할 수 있습니다.반복 중인 항목과 그 안에 있는 모든 항목에 존재합니다.그 이유는 특정 요소의 지시어가 동일한 $scope 객체를 공유하기 때문입니다.ng-repeat의 priority는 1000이므로 이미 $scope를 만들고 "person"을 여기에 넣었기 때문에 ng 클래스에서 "person"을 사용할 수 있습니다.

다음 Plnkr 참조:

http://plnkr.co/edit/ZI5Pv24U01S9dNoDulh6

보통 나는 좀 더 포괄적인 대답을 하고 싶지만, 그것을 하기에는 이 비트에 너무 많은 코드가 관련되어 있다.그래서 무엇이 가장 중요한지 보여주고, 이것을 보는 사람이 그것을 어떻게 사용하는지 알기를 바란다.동적 JSON 배열에는 열과 행이 모두 있지만 이 비트에서 가장 중요한 것은 ng-show="$last"입니다.동적 JSON 배열의 마지막 행만 표시됩니다.

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

언급URL : https://stackoverflow.com/questions/15410652/using-ng-repeat-and-ng-class-on-rows-inside-a-table