如何在< p-datatable>中使用模板 [英] How to use template in <p-datatable>
问题描述
我有一个非常基本的问题,我无法回答自己,因为大多数指向 http://www的链接.primefaces.org/primeng 不再起作用. 我也尝试注册到他们的论坛,但是他们的激活邮件从未到达.
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.
我使用Angular2,并且有一个包含两列的数据表:文件名和状态. 我要更改的状态列.它现在拥有一个从1到4的数字,我想根据状态显示一个glyphicon.
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.
我们正在使用PrimeNG 1.0.0-beta.16
We're using PrimeNG 1.0.0-beta.16
推荐答案
每个p-column
可以有两个模板-body
和header
,您应指定它是哪个.这不是强制性的,因为我认为body
是默认设置,在这种情况下,这就是您所需要的,但这是一个好习惯.您还需要将pTemplate
添加到模板中,以便p-column
使用它,这就是p-column
不会显示您提供的模板的原因.因此,您的代码应如下所示:
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>
这篇关于如何在< p-datatable>中使用模板的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!