在PrimeNG数据表中以2个不同图标(一个表示真,一个表示假)的形式表示布尔值



我想以数据表 primeng 中列字段的图标形式表示布尔值。以下是一段代码:

<p-dataTable [value]="ARRAY_METADATA" rowHover="true">
<p-column field="id" header="Field ID" [sortable]="true"></p-column>
<p-column field="booleanField" header="Boolean Field" [sortable]="true"></p-column>
</datatable>

我应该如何为真值显示"刻度",为布尔字段显示假值的"十字"?

<span class="badge">BOOLEAN VAUE</span>

我想上面的代码在纯 HTML 的情况下效果很好。但是,我又该如何放置条件语句来输出不同布尔值的两个不同图标呢? 有什么快速的想法吗??

我尝试使用 ngIf,但它仍然没有显示我需要的方式。它只是显示ng模板的内容:

<p-column field="someStringField" header="Some String Field">
<div *ngIf="someStringField; else elseBlock">
<button  type="button" pButton  icon="fa-check"></button>
</div>
<ng-template #elseBlock pTemplate="body" >
<button  type="button" pButton  icon="fa-times"></button>
</ng-template>
</p-column>

我相信您必须将任何您想要可见的内容放在列中才能在ng模板中

<ng-template let-col="rowData" pTemplate="body">
<button *ngIf="col.someValue" type="button" pButton  icon="fa-check"></button>
<button *ngIf="!col.someValue" type="button" pButton  icon="fa-times"></button>
</ng-template>

相关内容

  • 没有找到相关文章

最新更新