Question

我对此代码有疑问：

<div>
                <table class="list" border="0" cellpadding="0" cellspacing="0">
                    <thead>
                        <tr class="headerRow">
                            <th>Action&nbsp;</th>
                            <th>Busy&nbsp;</th>
                            <th>Subject&nbsp;</th>
                            <th ng-repeat="hour in hours">{{hour | number:2}}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="item in items">
                            <td>{{item.name}}</td>
                            <td>{{item.activityDate | date:'dd/MM/yyyy'}}</td>
                            <td>{{item.subject}}</td>
                            <td ng-repeat="hour in hours"
                                ng-class="{BusyCell: hours[$index] >= item.startDateTime && hours[$index] <= item.endDateTime}"></td>
                        </tr>
                    </tbody>
                </table>
            </div>

在ng-class中，我会为数组startDateTime和endDateTime中的每个单元格着色，但它只适用于那些只有这些数组中的值的第一行，而第二行只有两个不起作用。你有什么建议吗？提前谢谢！

Answer 1

这是一个基本的plnkr

但是，它表明您不需要使用$index。由于ng-repeat，您已经可以访问您所在的索引处的小时数。

<td ng-repeat="hour in hours" ng-class="{BusyCell: hour >= item.startDateTime && hour <= item.endDateTime}">
</td>

Answer 2

我认为你忘记使用＆＃34;跟踪$ index＆＃34;在你的ng-repeat中。

示例：

<div ng-repeat="n in [42, 42, 43, 43] track by $index">

查看文档。 https://docs.angularjs.org/api/ng/directive/ngRepeat

ng-class中的索引无法正常工作

2 个答案: