Angularjs 引导标签集标签标题 [英] Angularjs bootstrap tabset tab heading
问题描述
我想知道是否可以在 angularjs bootstrap tabset tab 标题中写入 html.我正在尝试在标题中添加一个 svg.我在 plunker 中创建了一个快速片段来尝试演示我遇到的问题.
I am wondering whether it is possible to write html inside an angularjs bootstrap tabset tab heading. I am trying to add a svg inside the title. I have created a quick snippet in plunker to try and demonstrate the issue I am having.
<tabset>
<tab heading="<span>hello</span><em>1</em>">One</tab>
<tab heading="Two">Two</tab>
<tab heading="Three">Three</tab>
</tabset>
http://plnkr.co/edit/qFsFGDNUIJj9nIF51ApU
有什么想法吗?
谢谢
推荐答案
Angular Bootstrap v0.14+
Angular Bootstrap v0.14 引入大多数以前提供的控件的新前缀.下面的原始答案仍然适用,但您必须使用新标签名称 uib-tabset
、uib-tab
和 uib-tab-heading
.
Angular Bootstrap v0.14+
Angular Bootstrap v0.14 introduced new prefixes for most previously provided controls. The original answer below still applies, but you must use the new tag names uib-tabset
, uib-tab
, and uib-tab-heading
.
<uib-tabset>
<uib-tab>
<uib-tab-heading>
<span>hello</span><em>1</em>
</uib-tab-heading>
One
</uib-tab>
<uib-tab heading="Two">Two</uib-tab>
<uib-tab heading="Three">Three</uib-tab>
</uib-tabset>
Angular Bootstrap <v0.14
如果您想在标题中使用 HTML,您应该在 tab
元素中使用 tab-heading
元素(如 文档):
Angular Bootstrap < v0.14
You should be using the tab-heading
element within the tab
element if you want HTML within the heading (as shown in the example in the docs):
<tabset>
<tab>
<tab-heading>
<span>hello</span><em>1</em>
</tab-heading>
One
</tab>
<tab heading="Two">Two</tab>
<tab heading="Three">Three</tab>
</tabset>
更新了 plunker 此处.
Updated plunker here.
这篇关于Angularjs 引导标签集标签标题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!