ng-repeat和选定的行

时间:2018-08-13 00:28:25

标签: javascript html css angularjs

这是上一个问题angularjs repeat table rows inside rows

的延续

我无法确定是否存在以下问题的解决方案。我希望能够在单击时突出显示当前行(并为描述行和“子”行单独进行处理,但在实际的行数组中我没有单独使用它们-我只是使用ng-重复第一行两次重复开始和ng重复结束方法)。

我目前有以下代码:

async

还有更多待处理的时间。

然后我有以下内容:

<tr ng-repeat-start="result in crud.model.lineItems track by $index"
                            ng-click="crud.selectedIndex=$index;"
                            ng-class="{selected: $index === crud.selectedIndex && result.rowNumber===1}">
                            <td ng-if="result.rowNumber===1">
                                <a href="{{'Items/DCI#/edit/item/'+ result.departmentId + '/' + result.categoryId + '/' + result.itemId}}" 
                                   target="_blank"
                                   title="@Labels.editItemInNewTab">{{result.itemId}}</a>
                            </td>
                            <td ng-if="result.rowNumber===1">{{result.item}}</td>

我正在尝试实现以下目标:如果单击顶部(描述)行,则要突出显示它。如果我单击接下来的每一行,我也要分别突出显示每一行(并使顶部的说明行不突出显示)。

我似乎无法弄清楚是否存在某些条件不能使前2行(描述+我的第一个矩阵)不一起突出显示。

使用我目前的方法,我可以突出显示最上面的描述行以及除第一行之外的所有行。我尝试了各种方法,但没有找到一种突出显示所需方法的方法。

您看到我的问题和可能的解决方案了吗?

1 个答案:

答案 0 :(得分:0)

我知道了!

这是我的解决方法:

<tbody>
                        <tr ng-repeat-start="result in crud.model.lineItems track by $index"
                            ng-click="crud.selectedMatrixIndex=-1;crud.selectedIndex=$index;"
                            ng-class="{selected: $index === crud.selectedIndex}">

位于ng-repeat和

的顶部

 <tr ng-repeat-end ng-if="result.inventId!==0"
                            ng-click="crud.selectedMatrixIndex=$index;crud.selectedIndex = -1;"
                            ng-class="{selected: $index === crud.selectedMatrixIndex}">
                            <td></td>
                            <td></td>
                            <td>
                                {{result.inventoryDescrip}}
                            </td>

在底部。我在控制器中将-1初始化为MatrixIndex,将0初始化为selectedIndex。结果,我现在能够独立选择行(顶部描述行和“子”行)。