How to use template in <p-datatable>

狂风中的少年 提交于 2019-12-21 04:19:20

问题


I've got a very basic question which I can't answer myself because most links to http://www.primefaces.org/primeng don't work anymore. I also tried registering to their forum but their activation mail never arrives.

I use Angular2 and have a datatable with two columns: filename and status. The status column I want to change. It holds now a number from 1 to 4 and I want to show a glyphicon based on the status.

I now have this, which is working:

<p-dataTable [hidden]="loading" [value]="files" selectionMode="single"  sortField="Status" [sortOrder]="-1">
  <p-column field="FileName" header="Naam" sortable="true"></p-column>
  <p-column field="Status" header="Status" sortable="true"></p-column>
</p-dataTable>

I tried this, just to test the templating but nothing changes:

<p-dataTable [hidden]="loading" [value]="files" selectionMode="single"  sortField="Status" [sortOrder]="-1">
  <p-column field="FileName" header="Naam" sortable="true"></p-column>
  <p-column field="Status" header="Status" sortable="true">
    <template let-file="rowData">
        {{file.Status == 1 ? "Yes" : "No"}}
    </template>
  </p-column>
</p-dataTable>

So save to conclude I'm not using it properly.

We're using PrimeNG 1.0.0-beta.16


回答1:


Each p-column can have two templates - body and header, you should specify which one it is. It's not mandatory because body is default I think and this is what you need in this case, but it's good practice. You also need to add pTemplate to template in order for p-column to use it, this is the reason p-column won't display template you provided. So, your code should look like this:

<p-dataTable [hidden]="loading" [value]="files" selectionMode="single" sortField="Status" [sortOrder]="-1">
  <p-column field="FileName" header="Naam" sortable="true"></p-column>
  <p-column field="Status" header="Status" sortable="true">
    <ng-template let-file="rowData" pTemplate type="body">
        {{file.Status == 1 ? "Yes" : "No"}}
    </ng-template>
  </p-column>
</p-dataTable>


来源:https://stackoverflow.com/questions/40404838/how-to-use-template-in-p-datatable

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!