如何将图片添加到工具提示 PrimeNG

Question

<i [pTooltip]="picture" tooltipPosition="bottom" class="pi pi-images"></i> <ng-template #picture> <img src="" alt="here img"> </ng-template>

错误类型 'TemplateRef' 无法分配给类型 'string'

有没有办法添加图片

Answer 1

这似乎是 GitHub 上的一个讨论话题。所以至少目前模板不支持工具提示。但我发现这个 comment: 上面写着：

Set escape to false, and it will render html:

<div pTooltip="Some text <br> next line" tooltipPosition="top" [escape]="false"></div>

这似乎适用于我试过的这个示例：

<p pTooltip="<img src='http://placekitten.com/g/100/200' />" [escape]="false">Hover me!</p>

DEMO STACKBLITZ

Answer 2

<i
pTooltip="<img class='cell-view-file__tooltip' src='{{cell.value}}' alt='{{fileName}}'/>"
[escape]="false"
appendTo="body"
class="pi pi-images"
tooltipPosition="bottom"
tooltipStyleClass="tooltip"

如何将图片添加到工具提示 PrimeNG

How to add picture to tooltip PrimeNG

typescript

primeng

angular