添加Angular TrngGrid额外列

时间:2014-10-17 02:54:06

标签: angularjs asp.net-mvc-4

我正在使用带角度的trnggrid来以网格格式显示我的数据。以下是我的代码

<div class="row-fluid">
    <table tr-ng-grid="" items="products" page-items="5" class="table table-condensed table-hover">
        <thead>
            <tr>
                <th field-name="Id" display-name="Id" enable-filtering="true" enable-sorting="true" cell-width="10em" display-align="right">
                </th>
                <th field-name="Name" display-name="Name" enable-filtering="true" enable-sorting="true" cell-width="10em" display-align="right">
                </th>
                <th field-name="Unit" display-name="Unit" enable-filtering="true" enable-sorting="true" cell-width="10em" display-align="right">
                </th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="product in products">

                <td>{{product.Id}}</td>
                <td>{{product.Name}}</td>
                <td>{{product.Unit}}</td>
                <td>
                    <a ng-click="viewProduct(gridDisplayItem.Id)">View |</a>&nbsp;
                    <a ng-click="editProduct(gridDisplayItem.Id)"> Edit |</a>&nbsp;
                    <a ng-click="deleteProduct(gridDisplayItem.Id)">Delete</a>
                </td>

            </tr>
        </tbody>
    </table>
</div>

然而,当我运行此功能时,会添加三个额外的列,其中包含无效的标题。然后将屏幕截图放在此链接中。 http://i.imgur.com/ZHoLTwW.png

有人可以建议一个解决方案。在此先感谢!!

1 个答案:

答案 0 :(得分:1)

删除tbody中的ng-repeat指令并删除它们不需要的前3个指令,因为table指令已经为你处理了....

                                                                                                                                                                                                     查看|                      编辑|                     删除