仅在按钮中显示 fontawesome 图标

Question

我有这个带有fa 图标的按钮。

<p-button><i class="fa fa-thumb-tack" [ngClass]="{'active': pinned}"></i></p-button>

目前看起来像这样

无论如何我可以只显示图标而不是按钮（使图标基本上可点击）。

Answer 1

也许您必须自定义p-button 样式，例如将其背景不透明度设为0。

或者您可以只显示图标并将事件绑定到它：

<i class="fa fa-thumb-tack" [ngClass]="{'active': pinned}" (click)="something()"></i>

但是你必须自己做，因为 PrimseNG 不支持那种图标按钮。

Answer 2

显然设置了黄色背景。你可以试试：

<p-button style='background-color: transparent; border: none'>
    <i style='color:silver' class="fa fa-thumb-tack" [ngClass]="{'active': pinned}"></i>
</p-button>

您可以将图标颜色设置为使其在白色背景下更明显的颜色。