Primeng

Question

我在 Angular 2 中使用 primeng 数据表。我的模型是 products 的数组。每个产品都有一个 locations 的数组。该位置数组有一个属性 name 。如何在 product 行中显示每个 name 个位置数组？

示例：如果第一个 product 在其 locations 数组中有 5 name，它应该在 locations 列中显示 5 names

目前我正在做这个。

<p-dataTable [value]="products" selectionMode="single" [(selection)]="selectedProduct" (onRowSelect)="onRowSelect($event)" [paginator]="true" rows="5" [responsive]="true">
              <p-column field="name" header="Name" [sortable]="true"></p-column>
              <p-column field="model" header="Model" [sortable]="true"></p-column>
              <p-column field="name" header="Quantity" [sortable]="true"></p-column>
              <p-column field="locations.location.name" header="Locations" [sortable]="true">
              </p-column>
            </p-dataTable>

Answer 1

您应该为该特定列使用 ngFor 检查以下代码

<p-dataTable [value]="products" selectionMode="single" [(selection)]="selectedProduct" (onRowSelect)="onRowSelect($event)" [paginator]="true" rows="5" [responsive]="true">
              <p-column field="name" header="Name" [sortable]="true"></p-column>
              <p-column field="model" header="Model" [sortable]="true"></p-column>
              <p-column field="name" header="Quantity" [sortable]="true"></p-column>
              <p-column field="locations" header="Locations" [sortable]="true">
                    <ng-template let-col let-locations="rowData" let-ri="rowIndex" pTemplate="body">
                        <span *ngFor="let item of locations.location">{{item.name}} <br/></span>
                    </ng-template>
              </p-column>             
</p-dataTable>

Answer 2

替换你的字段

 <p-column field="Sessions" [editable]="true" header="Start Date">              
                    <ng-template let-col let-sessions="rowData" let-ri="rowIndex" pTemplate="body">
                         <div>
                            <p>{{sessions.Sessions[0].StartDateTime | date: 'd,MMM,yyyy'}}</p>
                        </div>
                    </ng-template>
                </p-column>

Primeng - 无法在列中显示数组项

Primeng - Cant display array items in a column

angular

angular2-template