Angular js -仅使用UI Bootstrap的标签库
Angular js -仅使用UI Bootstrap的标签库
提问于 2015-06-14 12:58:59
我只使用了UI Bootstrap的Tab组件。
https://github.com/angular-ui/bootstrap/tree/master/src/tabs
在包含上面的库并添加以下代码后，浏览器中没有任何结果。控制台中也没有错误。
var app = angular.module('app', ['ui.bootstrap.tabs']);
<tabset justified="true">
<tab heading="Justified">Justified content</tab>
<tab heading="SJ">Short Labeled Justified content</tab>
<tab heading="Long Justified">Long Labeled Justified content</tab>
</tabset>我已经设法得到这项工作与完整的UI-Bootstrap库与上面的代码相同。我不想包含整个库，因为我只使用Tab模块。
回答 1
Stack Overflow用户
发布于 2015-06-14 14:13:18
您需要包括模板。@Fieldset有正确的想法，只是可能不是解决问题的最清晰的建议。
如果只包含tabs.js，请确保单独添加模板。您可以使用$templateCache脚本标记方法轻松完成此操作：
<script type="text/ng-template" id="template/tabs/tabset.html">
<div>
<ul class="nav nav-{{type || 'tabs'}}" ng-class="{'nav-stacked': vertical, 'nav-justified': justified}" ng-transclude></ul>
<div class="tab-content">
<div class="tab-pane"
ng-repeat="tab in tabs"
ng-class="{active: tab.active}"
tab-content-transclude="tab">
</div>
</div>
</div>
</script>
<script type="text/ng-template" id="template/tabs/tab.html">
<li ng-class="{active: active, disabled: disabled}">
<a href ng-click="select()" tab-heading-transclude>{{heading}}</a>
</li>
</script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30829662
复制相关文章
相似问题
腾讯云开发者
