FontAwesome 图标未显示按钮答案

【问题标题】：FontAwesome Icon not showing for buttonFontAwesome 图标未显示按钮
【发布时间】：2018-12-06 13:57:50
【问题描述】：

<ng-template pTemplate="summary" let-rowData>
<div style="text-align:left">
  <i class="fa fa-pencil" title="Edit"></i>
  <button type="button" pButton icon="fa fa-pencil" (click)="showDialogToAdd()" label="Add"></button>
</div>

会显示铅笔图标，但不会显示按钮。但是，按钮不会。

这是从primeng示例中提取的

https://github.com/primefaces/primeng/blob/master/src/app/showcase/components/table/tablepagedemo.html

（我添加铅笔图标只是为了证明这不是我试图包含的 css 的问题）

为什么会这样？

【问题讨论】：

按钮可能使用了错误的字体。在您的开发工具中检查它，您会发现它的字体与其上方的i 元素不同。
我正在查看您链接的文件，但我没有看到任何 <button> 示例可供借鉴。
发现问题，忘记在我的应用模块中包含pButton，谢谢！
@jayjay93 PrimeNG 现在建议使用 Prime 图标。希望此链接对primefaces.org/primeng-6-0-0-beta-1-released-primeicons 有所帮助

标签： javascript angular primeng

【解决方案1】：

在按钮的class 属性中定义字体真棒图标，而不是icon 属性。

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
<div style="text-align:left">
  <i class="fa fa-pencil-alt" title="Edit"></i>
  <button type="button" pButton class="fa fa-pencil-alt" ></button>
</div>

【讨论】：

发现问题，忘记在我的应用模块中包含 pButton