angularjs 行内重复 table 行

Question

我已经阅读了一些关于这个主题的现有主题，我认为我已经接近了，但我可能需要一些帮助。我正在尝试显示采购订单的行项目。如果行项目数组中的行有 inventId=0 我想将有关它的所有信息显示为一行。但是，如果 inventId > 0，那么我想在 "header" 行和其余列中显示 itemId、昵称和描述，作为类似于跟踪行的普通行。这是我当前的代码，以在每个 "matrix" 行上方重复的 "header" 行结束。

<table id="lineItemsTable"
       class="table table-bordered table-hover table-list scTable">
    <thead>
        <tr>
            <th>@Labels.itemId</th>
            <th>@Labels.nickname</th>
            <th>@Labels.description</th>
            <th>@Labels.ordered</th>
            <th>@Labels.cost</th>
            <th>@Labels.extension</th>
            <th>@Labels.price</th>
            <th>@Labels.margin</th>
            <th>@Labels.receiveLocation</th>
            <th>@Labels.received</th>
            <th>@Labels.remaining</th>
            <th>@Labels.vendorPartNo</th>
            <th>@Labels.upc</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat-start="result in crud.model.lineItems track by $index"
            ng-click="crud.selectedIndex=$index;"
            ng-class="{selected: $index === crud.selectedIndex}">
            <td>{{result.itemId}}</td>
            <td>{{result.item}}</td>
            <td>{{result.itemDescrip}}</td>
        </tr>
        <tr ng-repeat-end ng-if="result.inventId!==0">
            <td></td><td></td><td>{{result.inventoryDescrip}}</td>
        </tr>
    </tbody>
</table>

我附上了我想使用 lineItems 数组实现的屏幕截图：

Answer 1

以书面形式提出我的问题总是有帮助的。我一发布它，我想我想出了一个解决方案。我会将 rowNumber 列添加到返回行项目的存储过程中，并且仅当 Rn = 1 时才显示该信息。

虽然我无法使原始 odd/even 行背景色，但我让它工作了。现在所有 "header" 行看起来都是偶数，这可能是一个不错的效果。

angularjs 行内重复 table 行

angularjs repeat table rows inside rows

html

javascript

angularjs

angularjs-ng-repeat