繁体   English   中英

angular *ng用于显示表格

[英]angular *ngfor to display table

当我用 *ng-for 循环调用 object 列表时,我在表上得到了多个相同的值。

例如:如果 object 列表是:

objList = [{value:value1}]

它将返回一个包含一行的表

但如果 object 列表有多个值:

objList = [{value:value1},{value:value2},{value:value3}]

例如,当数组列表的长度为 3 时,它将显示一个包含 9 个值的表格:

value1
value2
value3
value1
value2
value3
value1
value2
value3

我的 HTML 代码(使用 Prime-NG):

<ng-template pTemplate="body">
          <tr *ngFor="let permissionOrder of objectList">
            <td>{{permissionOrder.value}}</td>
          </tr>
</ng-template>

你不应该使用 ngFor。 而是像这样使用它

<p-table [value]="objList">
    <ng-template pTemplate="header">
        <tr>
            <th>Orders</th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-permissionOrder>
        <tr>
            <td>{{permissionOrder.value}}</td>
        </tr>
    </ng-template>
</p-table>

Prime ng 将自动循环遍历数组,您将在 permissionOrder 中获得单个项目

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM