Question

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

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

目前我正在这样做。

<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 - 不能在列中显示数组项

2 个答案: