Как отображать в заголовке панели только потрясающие иконки?

Я использую PrimeNG и просто пытаюсь добавить потрясающие шрифты иконки в заголовок панели, но моя проблема в том, что если я удаляю текст (LABEL), случайный класс CSS появляется на экране ui-btn. Может кто-то указать мне верное направление?.

Вот мой рабочий код:

PLUNKER

<p-header>
  Registration Form
  <button type="button" pButton icon="fa-plus" style="float:right" label="Add"></button>
  <button type="button" class="ui-button-danger" pButton icon="fa-minus" style="float:right" label="Delete"></button>
</div>

Это пример того, что я пытаюсь сделать:

Источник

2 ответа

Решение

Просто удалите свойство label. Я думаю, что вы делаете, установите его пустым (label="") вместо того, чтобы удалить его.

Попробуй это:

<p-header>
  Registration Form
  <button type="button" pButton icon="fa-plus" style="float:right"></button>
  <button type="button" class="ui-button-danger" pButton icon="fa-minus" style="float:right"></button>
</div>

Редактировать Если вы хотите что-то похожее на ваше изображение, вам нужно настроить его с помощью CSS и больше не использовать кнопки PrimeNG:

HTML:

<div id="header">
  <a (click)="refresh()"><i class="fa fa-refresh fa-border fa-2x"></i></a>
  <a><i class="fa fa-bars fa-border fa-2x"></i></a>
  <a><i class="fa fa-expand fa-border fa-2x"></i></a>
  <a><i class="fa fa-minus fa-border fa-2x"></i></a>
</div>

CSS:

<div id="header">
  <a (click)="refresh()"><i class="fa fa-refresh fa-border fa-2x"></i></a>      
</div>

Смотри работающий Плункер

Источник

Для меня проблема заключалась в атрибуте "иконка", связанном с тегом кнопки. Это показывает ярлык ui-btn:

<button type="button" pButton iconPos="left" icon="fa fa-plus-circle" (click)="addCustomer()" style="float:left;margin: 5px;"></button>

Это для моего приложения работает:

<button type="button" pButton icon="fa fa-plus-circle" (click)="addCustomer()" style="float:left;margin: 5px;"></button>
Источник
Другие вопросы по тегам