AngularJS ng-repeat表格嵌套循环

最新推荐文章于 2025-08-06 10:50:22 发布

原创最新推荐文章于 2025-08-06 10:50:22 发布 · 4.7k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#angularjs

本文详细介绍了AngularJS中ng-repeat指令的使用，特别是如何进行表格的嵌套循环展示数据。通过实例，展示了如何通过ng-repeat处理复杂的数据结构，实现动态生成表格行和列，帮助开发者更好地理解和掌握AngularJS的数据绑定和遍历能力。

<tr ng-repeat = "item in tableData">
    <td ng-class="{'no-border-top': $index != 0}" width="20"></td>
    <td>{{item.buyDate *1000 | date: 'yyyy-MM-dd HH:mm:ss' || '-'}}</td>
    <td>
        <span ng-if="!item.detailList">-</span>
        <span ng-repeat="list in item.detailList">{{list.name + '（'+list.count+'）'}}<br></span>
    </td>
    <td>
        <span ng-if="!item.detailList">-</span>
        <span ng-repeat="list in item.detailList">{{list.approval || '-'}}<br></span>
    </td>
    <td>
        <span ng-if="!item.payMoney">-</span>
        <span>{{'￥'+item.payMoney || '-'}}<br></span>
    </td>
    <td>
        <span>{{item.storeNo || '-'}}<br></span>
    </td>
    <td >
        <span>{{item.storeUserNo || '-'}}<br></span>
    </td>
    <td ng-class="{'no-border-top': $index != 0}" width="20"></td>
</tr>