Question

我正在用angular 6中的bootstrap popover。我想在内容中添加一些html代码。

<button (click)= "changeClass = !changeClass;"
              type="button"
              class="btn actionButton"
              [style.opacity] = "getStyle()"
              placement="left"
              popoverClass="popover"
              ngbPopover="Here i want to add some html code" > <img src="assets/images/dots.png"> </button>

请帮帮我

Answer 1

这将起作用。

<div>
    <ng-template #popContent>
        <div>

        </div>
    </ng-template>

    <button type="button" class="btn btn-link" [ngbPopover]="popContent" placement="bottom-right" #p="ngbPopover">
    </button>
</div>

Answer 2

为其提供对模板的引用。

直接来自the docs：

<ng-template #popContent>Hello, <b>{{name}}</b>!</ng-template>
<button type="button" class="btn btn-outline-secondary" [ngbPopover]="popContent" popoverTitle="Fancy content">
  I've got markup and bindings in my popover!
</button>

在Angular 6中将HTML添加到Bootstrap popover

2 个答案: