Как изменить значок PrimeNG-Dropdown - PullRequest
0 голосов
/ 06 января 2019

Я пытался изменить значок, который PrimeNG предоставляет по умолчанию. Я близко, но есть кое-что, чего я не понимаю.

Я создал переменную в моем component.ts со значком шрифта-awesome. В шаблоне я назначил атрибут [dropdownIcon] со значением переменной var. При проверке в браузере отображается пустой квадрат. Отладка Я видел, что если я снял флажок атрибута «содержимого» .ui-dropdown-trigger-icon: before, правильно отображает значок, но я не знаю, как удалить это в моем коде.

Если возможно, я хотел бы знать, как убрать границу рамки, я уже пробовал, но ничего не помогло.

header.component.ts

card="fas fa-id-card fa-lg";

header.component.html

<p-dropdown [dropdownIcon]="card" [options]="products" [(ngModel)]="selectedProduct" optionLabel="label" placeholder="Registro"></p-dropdown>

header.component.scss

Я пытался, безуспешно (ничего не отображается)

:host {
  ::ng-deep .ui-dropdown-trigger-icon:before{
    content: "";
  }
}

Захваты отладки:

Теперь Как отображается get Результат отката

1 Ответ

0 голосов
/ 06 января 2019

Вы можете попробовать это:

.fa-id-card:before {
    content: "\f2c2" !important;
}

Чтобы удалить границу поля, добавьте свойство в выпадающий список:

[style]="{'border': 'none'}"

Это демо

...