angularjs在行内重复表行

时间:2018-07-23 22:34:00

标签: javascript html angularjs angularjs-ng-repeat

我已经阅读了有关该主题的一些现有主题,我想我已经接近了,但可能需要一些帮助。我正在尝试显示采购订单的订单项。如果订单项数组中的行的inventId = 0,则我希望将有关它的所有信息显示为单行。但是,如果inventId> 0,那么我想在“标题”行和其余各列中将itemId,昵称和描述显示为与跟踪行类似的普通行。这是我当前的代码,其结尾是在每个“矩阵”行上方重复的“标题”行。

<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数组实现的屏幕截图:

enter image description here

1 个答案:

答案 0 :(得分:0)

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

尽管我无法使原始的奇数/偶数行变色,但我还是做到了。现在,所有“标题”行看起来都是偶数,这可能是可以的。