以角度显示 <p-table> 组件中的图标（primeng-table）答案

【问题标题】：Display Icon in <p-table> component in angular (primeng-table)以角度显示 <p-table> 组件中的图标（primeng-table）
【发布时间】：2021-10-26 07:54:51
【问题描述】：

我有一个要实现的功能，我从 API 获取数据并使用它在 a 中显示它，现在我的要求是在相应行包含 a 的列之一中显示刻度值ex的布尔值。一行有 6 列，其中一列是布尔值，所以如果值为 true，我必须在列中显示刻度，否则不显示。我希望你能理解这个问题。

我有一个名为 standardTable.component.ts 的共享组件，我将 colDef、rowData 和其他可配置数据等数据传递给该组件。我当前正在更改的组件称为 job-list-view.component.ts，列定义如下

this.cols = [
      { field: 'jobSegment', header: 'Service No', isBoolean: false, callback: this.navigateToJobDetails },
      { field: 'serviceName', header: 'Service' },
      { field: 'status', header: 'Status', isBoolean: false },
      { field: 'jobDateSpecial', header: 'Service Date', isBoolean: false, dateOnly: true },
      { field: 'orderDate', header: 'Order Date', isBoolean: false , dateOnly: true },
      { field: 'dueDate', header: 'Due Date', isBoolean: false, dateOnly: true},
      { field: 'witnessNames', header: 'Witness(es)', isBoolean: false, isArray: true  },
      { field: 'jobPriority', header: 'Priority', isHtml: true },
      { field: 'lastInvoiceDate', header: 'Last Invoice Date', callback: this.navigateToPayTab, dateOnly: true },
      { field: 'workOrderOrderedByClient', header: 'Hiring Company', isBoolean: false },
      { field: 'workOrderOrderedByContact', header: 'Hiring Contact', isBoolean: false },
      { field: 'witnessStartTimeWithTimeZone', header: 'Time', isBoolean: false },
      { field: 'caseName', header: 'Case Name', isBoolean: false},
      { field: 'isBackOrder', header:'Back Order'}
    ];

我添加了 Back Order 的最后一个 col 定义，因为我想为那些 isBackOrder 为 true 的行的值显示一个刻度线。有没有办法我可以做到这一点？并且由于标准表是一个共享组件，因此我无法对此进行太多更改。任何帮助将不胜感激！

【问题讨论】：

如果您不允许在标准表中编辑primeng-datatable 的模板，那么您唯一的选择就是创建一个新组件。如果有你需要的常见行为，你可以扩展 standardtable.ts。
@MikkelChristensen what 如果我可以编辑标准表，我该如何实现？仅供参考，我在正文的 ng-template 中有多个 ngSwitchCases。

标签： javascript angular typescript primeng-datatable p-table

【解决方案1】：

所以这很简单，我不知道我是怎么错过的，您只需将数据作为布尔值传递，然后在列定义中添加 isBoolean:true，p-table 将自动在任何地方打勾该值为真，如果为假则为空。

【讨论】：