如何为 angularjs 中的动态行设置 ID

Question

我使用 ngtable 创建了一个动态 table ，3 列的 table 数据是从 json.In 中获取的，第 4 列的 table green/red 色圈应该根据连接是否成功来。我用 javascript 做了同样的事情（不使用 json），在第 4 列中我设置了四个不同的 ID，如果连接成功，我会根据 ID 使用 ajax 更改颜色。在 angular 使用 json 我无法这样做，我创建了动态 table 但是如何设置 id 以及从哪里获取图像我无法 do.Can任何人帮助这个。

<table ng-table>
<thead>
<tr>
<th>Feature</th>
<th>DaysUp</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="user in users">
<td>{{user.name}}</td>
<td>{{user.status}}</td>
</tr>
</tbody>    
</table>

Answer 1

您可以使用范围 ID 和索引值来生成唯一 ID。由于 ng-repeat 创建子作用域，因此您将获得一个作用域 ID（作用域的唯一 ID），您可以使用 $index.

附加该 ID

        <tr ng-repeat="user in users" id="{{$parent.$id+'-'+$index}}">
            <td>{{user.name}}</td>
            <td>{{user.status}}</td>
        </tr>

JSFiddle Demo

Answer 2

HTML:

<div ng-app="myapp" ng-controller="myctrl">

    <table>
        <thead>
        <tr>
            <td>Name</td>
            <td>DaysUp</td>
            <td>Status</td>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="user in users">
            <td>{{user.name}}</td>
            <td>{{user.daysup}}</td>
            <td><img width="20px" height="20px" ng-src="{{imageurls[user.status-1]}}" /> </td>
        </tr>
        </tbody>
    </table>
</div>

脚本：

angular.module('myapp',[])
            .controller('myctrl',function($scope){
                $scope.users =[
                    {'name':'xyz','daysup':2,'status':1},
                    {'name':'abc','daysup':4,'status':2},
                    {'name':'klm','daysup':6,'status':3},
                    {'name':'yrt','daysup':9,'status':4}
                ];
                $scope.imageurls = [
                        'http://www.wpclipart.com/blanks/buttons/glossy_buttons/glossy_button_blank_yellow_circle.png',
                        'http://pix.iemoji.com/sbemojix2/0702.png',
                        'http://clker.com/cliparts/u/g/F/R/X/9/green-circle-md.png',
                        'http://pix.iemoji.com/sbemojix2/0701.png'
                ];

            });

Plunker Demo

如何为 angularjs 中的动态行设置 ID

How to set id's for dynamic rows in angularjs

angularjs