Блог

Я использую primeng для библиотеки компонентов пользовательского интерфейса Angular, и я хочу знать, как добавить дополнительную пользовательскую кнопку в раскрывающемся списке primng (не в его диалоговом окне). пример:- На месте, как показано в img

Как и в случае с любым другим HTML-шаблоном, вы можете добавить img и absolute position изменить его.

Шаблон:

 lt;div class="dropdown-wrapper"gt;  lt;label class="control-label"  for="data-to-choose-dropdown-id"gt;  Data To Choose  lt;/labelgt;  lt;p-dropdown [options]="_options"  [attr.id]="'data-to-choose-dropdown-id'"  [filter]="true"  appendTo="body"  [showClear]="true"  placeholder="Choose"  [style]="{'width':'100%'}"  optionValue="id"  optionLabel="name"gt;  lt;/p-dropdowngt;  lt;img class="extra-button" [src]="'assets/images/icons/magnifying-glass-brand.svg'" (click)="onExtraButtonClick()"gt; lt;/divgt;  

SCSS:

 label {  color: #6f8599; }  .dropdown-wrapper {  position: relative;   ::ng-deep p-dropdown{  .p-placeholder {  opacity: 0.7;  }  }   .extra-button {  position: absolute;  } }