Angularjs Table 知识点纪要

Posted by zhulinpinyu on February 24, 2016

Angularjs Table 知识点纪要

$index : 自动序号
$even : 偶数判断,比如偶数行
$odd : 奇数判断,比如奇数行

示例代码$index

<table>
  <tr ng-repeat="x in names">
    <td>{{$index + 1}}</td>
    <td>{{x.Name}}</td>
    <td>{{x.Country}}</td>
  </tr>
</table>

示例代码$even $odd

<table>
  <tr ng-repeat="x in names">
    <td ng-if="$odd" style="background-color:#f1f1f1">{{ x.Name }}</td>
    <td ng-if="$even">{{ x.Name }}</td>
    <td ng-if="$odd" style="background-color:#f1f1f1">{{ x.Country }}</td>
    <td ng-if="$even">{{ x.Country }}</td>
  </tr>
</table>

完整示例

See the Pen Angular Table by zhulinpinyu (@zhulinpinyu) on CodePen.

参考:http://www.w3schools.com/angular/angular_tables.asp