ngx bootstrap popoverTitle визуализировать как HTML

Я использую попвер ngx bootstrap: http://valor-software.com/ngx-bootstrap/#/popover#popover-directive. Я могу отображать всплывающее тело как HTML. Однако это не работает для PopoverTitle. В документации сказано, что тип всплывающего окна — строка | TemplateRef и PopoverTitle — это строка, поэтому, вероятно, я не могу отобразить заголовок в виде html для всплывающего заголовка, как я сделал для тела всплывающего окна. В приведенном ниже коде: я получаю содержимое тела всплывающего окна в виде HTML, как и ожидалось. Но не для popoverTitle.

< span *ngFor="let item of items;">
    < template #popTemplate>
        <div [innerHtml]="getPopoverDetails(item)"></div>
    < /template>
    < template #popTemplate1><div [innerHtml]="getPopoverTitle(item)"></div>
    < /template>
    < img class="" [src]="item.image" [popover]="popTemplate" [popoverTitle]="popTemplate1" triggers="mouseenter:mouseleave" 
placement="right"/>                                  
< /span>  

Я думаю, это потому, что popoverTitle не поддерживает TemplateRef. В этом случае есть ли способ отобразить строку popoverTitle как HTML (причина в том, что содержимое моего заголовка не является простым текстом, мне также нужно поместить изображения и другой контент html)


person user1892775    schedule 03.09.2017    source источник
comment
функция находится в дорожной карте   -  person valorkin    schedule 03.10.2017


Ответы (1)


< span *ngFor="let item of items;">
    < template #popTemplate>
        <div class="popover-title popover-header" [innerHtml]="getPopoverTitle(item)" style="margin:-10px -10px -0px -10px;">
        <div [innerHtml]="getPopoverDetails(item)"></div>
    < /template>
    < img class="" [src]="item.image" [popover]="popTemplate" triggers="mouseenter:mouseleave" 
placement="right"/>                                  
< /span>  

Я изменил ваш код, включив в него HTML-контент вашего заголовка, и включил класс popover-header popover-title в качестве класса заголовка всплывающего окна по умолчанию и включил стиль, чтобы удалить эффект заполнения по умолчанию для всплывающего окна и сделать его похожим на заголовок всплывающего окна.

person Raghu Ram    schedule 03.03.2018