使用ng-repeat保持表中的一列相同

时间:2016-02-23 17:43:04

标签: javascript angularjs

我有一个表从json文件中提取数据并用ng-repeat填充td。但是,我希望我的第一列(Line#)保持不变。例如,仅1,2,3,4表示客户所在的电话线,其余数据用ng-repeat填充。我一直在研究,并没有找到任何任何帮助表示赞赏。代码如下。

        

        <tr>
            <th>Line #</th>
            <th>Name</th>
            <th>Phone #</th>
            <th>Range</th>
        </tr>
        <tr ng-repeat="customer in customers | orderBy: 'id' | limitTo: 4" ng-class="{ 'alert-danger' : customer.in == 'no', 'alert-success' : customer.in == 'yes', 'alert-warning' : customer.in == 'unknown' }">
            <td>1</td>
            <td>{{customer.name}}</td>
            <td>{{customer.phoneNumber}}</td>
            <td>{{customer.in}}</td>
        </tr>
    </table>
    <div class="modal-close" ng-click="toggleModal()">X</div>
</div>

1 个答案:

答案 0 :(得分:0)

Angular的ng-repeat公开了一个$index属性,该属性将返回数组的当前索引。所以你的HTML看起来像:

    <tr ng-repeat="customer in customers | orderBy: 'id' | limitTo: 4" ng-class="{ 'alert-danger' : customer.in == 'no', 'alert-success' : customer.in == 'yes', 'alert-warning' : customer.in == 'unknown' }">
        <td>{{$index + 1}}</td>
        <td>{{customer.name}}</td>
        <td>{{customer.phoneNumber}}</td>
        <td>{{customer.in}}</td>
    </tr>