Question

我想到了一种为我的tooltip指令提供HTML模板的方法。该指令使用一个组件作为其外部模板，但有一段时间该指令的内部HTML 是用户想要设计的东西，例如在工具提示中插入一个图标orimage。

这就是指令现在的工作方式。你可以给它一个简单的字符串，一个对象或设计的字符串：

<div [my-tooltip]="'some text...'"></div>
<div [my-tooltip]="objectText"></div>
<div [my-tooltip]="'<div style=\'color:red;\'>text with style</div>'"></div>

但是，这是一种简单的方法，如果用户希望工具提示具有更多覆盖HTML，如下所示：

 <div ng-class="{'icon-success' : mystatus.Status==='SUCCESS'}" style="cursor: pointer">{{myObject.text}}</div>

怎么做？它应该去哪里？我该怎么用？内在的html孩子？我不喜欢那个approch，因为可能有内在的孩子不属于工具提示的一部分。请指教。

Answer 1

您可以使用ng-bootstrap库将自定义html模板添加到弹出窗口： https://ng-bootstrap.github.io/#/components/popover

为指令提供内部HTML模板的最佳方法是什么？

1 个答案: