PrimeNg-Button：如果未提供标签，则按钮不显示fa图标

Question

我想显示带有图标且没有标签的按钮。 我正在尝试这个

<button type="text" pButton icon="fa-angle-left"></button>

但它没有显示fa图标，并显示空白按钮。 如果我尝试给出标签，那么它将显示图标和标签。

不知道我做错了什么。

Answer 1

我只是尝试了2.0.Final of primeng并且它完全正常工作。

<button pButton type="text" icon="fa-close"></button>

Answer 2

首先：确保将 ButtonModule 导入组件模块（或仅AppModule ），如：

import { ButtonModule } from 'primeng';

第二次：将 ButtonModule 添加到导入数组，例如：

@NgModule({
  imports:      [ BrowserModule, FormsModule, ButtonModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})

最后：使用以下代码创建所需的按钮：

<button pButton type="button" (click)="count()" icon="fa-angle-left"></button>

在这里尝试所有： https://embed.plnkr.co/GEpcJG/

NB：我认为您通常不会遇到 primeng 的其他问题。

Answer 3

我已经解决了这个问题 实际上是因为jquery ui css。它超越了ui-button-icon-only类。 所以到目前为止我已经删除了jquery-ui.css文件，现在按钮显示图标。 感谢

Answer 4

在我的情况下，我刚刚从PrimeNG添加了 ButtonModule ，瞧，它有效！

import {ButtonModule} from 'primeng/primeng';

Answer 5

我已经通过为类“ ui-button-icon-only”覆盖css中的一个参数来解决此问题：

.ui-button-icon-only {
  text-indent: initial;
}