ng-repeat指令应用

1.ng-repeat 一看就知道跟foreach等指令类似,用于循环重复。一般用于列表和表格中。用法如下:

<tr ng-repeat="data in dataList">
        <td>{{ data.name }}</td>
         <td>{{ data.age }}</td>
</tr>

显而易见,dataList是定义在$scope下的一个数组。

除了直接遍历数据,还有以下属性可以辅助开发。

$index----显示每一个子项的index

<li ng-repeat=" data in dataList ">{{ $index }}</li>

 

$first $middle $last(除了第一项返回true,其他都返回false)

$even $odd(基数行放回true,偶数行返回false)

<li class="{{ $even &&  'active1‘ }}" ng-repeat=" data in dataList ">{{ data }}</li>

 

2.另外还有ng-repeat-start和ng-repeat-end两个指令很有用,

用来定义重复的结构的开始和结尾

<div ng-repeat-start="data in dataList">{{data}}</div>
<div ng-repeat-end>{{data}}</div>

  

转载于:https://www.cnblogs.com/toodeep/p/4966440.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值