Add HTML to popover title in ngx-bootstrap

Question

I'm trying to add a line break to a popover title in ngx-bootstrap.

Is that possible?

The line break tag below comes out as text, and for some reason ng-template seems to be within the popover body (not clear how to add title).

<ng-template #popTemplate>Just another: {{content}}</ng-template>
<button type="button" class="btn btn-warning"
        [popover]="popTemplate" popoverTitle="Template ref <BR> content inside">
  TemplateRef binding
</button>

https://stackblitz.com/edit/angular-ohncpd

Answer 1

No you cannot add HTML in the title.

But that doesn't mean we can't improvise

https://stackblitz.com/edit/angular-ohncpd-lbhdgg?file=app/custom-content.html

  <h3 class="popover-title popover-header" style="margin: -.5rem -.75rem 0 -.75rem;">Template ref <BR> content inside</h3>
  Just another: {{content}}

  </ng-template>



<button type="button" class="btn btn-warning"
        [popover]="popTemplate" >
  TemplateRef binding
</button>