angular - 如何在 <p-datatable> 中使用模板

标签 angular datatable angular2-template primeng

我有一个非常基本的问题,我自己无法回答,因为大多数链接都指向 http://www.primefaces.org/primeng不要再工作了。 我也尝试注册到他们的论坛,但他们的激活邮件从未到达。

我使用 Angular2 并有一个包含两列的数据表:文件名和状态。 我要更改的状态栏。它现在包含一个从 1 到 4 的数字,我想根据状态显示一个字形。

我现在有了这个,它正在工作:

<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>

我试过了,只是为了测试模板,但没有任何变化:

<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>

所以保存下来得出我没有正确使用它的结论。

我们正在使用 PrimeNG 1.0.0-beta.16

最佳答案

每个 p-column 可以有两个模板 - bodyheader,你应该指定它是哪一个。这不是强制性的,因为我认为 body 是默认的,在这种情况下这是你需要的,但这是一个很好的做法。您还需要将 pTemplate 添加到模板中,以便 p-column 使用它,这就是 p-column 不会显示的原因您提供的模板。因此,您的代码应如下所示:

<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>

关于angular - 如何在 <p-datatable> 中使用模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40404838/

相关文章:

javascript - 使用 jquery 数据表的单个复选框选择

javascript - Angular 与数据表注入(inject)器错误

javascript - Angular 2 Material : sidenav toggle from component

Angular2 - 用 html 插入字符串

javascript - 在 angular4 上每 n 个项目创建新行

angular - 在 Ionic 2 中隐藏子页面中的选项卡

javascript - 无法在给定的文件扩展名中有效地找到文件的文件扩展名

Angular >4.3 & <5.2.3 - JWT 拦截器 - 刷新 token

jsf-2 - Primefaces 命令按钮不更新数据表

NGX 数据表上的 Angular 2 Pipe ShortDate