将 html 添加到弹出窗口中的标题（角度引导）

Question

如何在弹出框的标题中添加html？在文档中，我只能在内容中使用 html。可以在标题中添加html吗？我知道我可以在 css 中设置它的样式，但我想在标题中添加按钮。

https://plnkr.co/edit/G1Q6g3oZhFKZpgbsMCUK?p=preview

<button uib-popover-html="htmlPopover" popover-placement="bottom" popover-title="Tekst -> <button>Edit</button>" class="btn btn-default">HTML Popover</button>

Answer 1

如果您查看最终生成的 HTML，您可以了解它是如何在 UI 上呈现的。

为您的属性popover-title="Tekst -> <b>Sample</b> <button>Edit</button>"

生成的HTML如下，

<h3 class="popover-title ng-binding ng-scope" ng-bind="uibTitle" ng-if="uibTitle">Tekst -&gt; &lt;b&gt;Sample&lt;/b&gt; &lt;button&gt;Edit&lt;/button&gt;</h3>

请检查属性“ng-bind”，这意味着您提供给 popover-title 的任何内容都将在内部附加到 ng-bind。

如果您观察 uib-popover-html="htmlPopover" 的弹出框主体生成，则类似

相应的 HTML 会生成如下

<div class="popover-content ng-binding" ng-bind-html="contentExp()"><b style="color: red">I can</b> have <div class="label label-success">HTML</div> <input type="button" value="sample"> content</div>

在这里您可以看到“ng-bind-html”，这就是为什么 body 可以采用任何 HTML 并将其显示在 UI 上，而对于 Title 则不是这样，因为它使用了 ng-bind。

检查这个插件：http://plnkr.co/edit/eREFCpVrYSi6kw7mNNXq?p=preview