uib-表集不从外部模板加载

Question

版本:ui-引导-tpls-2.5.0.min.js

在加载在外部html文件中定义的选项卡时，我面临问题。在index.html文件中，我引用了在外部模板中定义的选项卡。

<div class="col-lg-12 col-xs-12 col-sm-12 col-md-12 no-padding" template="Scripts/tpl/optionTab.tpl.html" templateUrl="Scripts/tpl/optionTab.tpl.html" ></div>

下面的示例代码在文件Script/tpl/optionTab.tpl.html中定义

<uib-tabset active="active">
<uib-tab index="0" heading="Static title">Static content</uib-tab>
<uib-tab index="$index + 1" ng-repeat="tab in tabs" heading="{{tab.title}}" disable="tab.disabled">
  {{tab.content}}
</uib-tab>
<uib-tab index="3" select="alertMe()">
  <uib-tab-heading>
    <i class="glyphicon glyphicon-bell"></i> Alert!
  </uib-tab-heading>
  I've got an HTML heading, and a select callback. Pretty cool!
</uib-tab>

​

如果我直接将其添加到index.html文件中，即不引用外部模板中的相同代码，那么上面的代码工作得很好。有谁能指点一下这里的问题吗？控制台中没有错误。我试过模板，templatUrl，ng-包含，但什么都没有用。

Answer 1

我正在张贴对我自己的问题的答案，因为它可能会帮助像我这样的新手。

我不敢相信，这是一个非常简单的解决方案，没有任何专家能够帮助指出正确的方向。我想要的只是将定义在外部html文件中的uib表集包含到index.html中。我尝试了uib的选项，比如template-url(看起来它是错误的，因为它没有选择外部文件，也没有抛出错误，比如多个根元素等等)。我试过了-包括但似乎什么都不管用。根据请求共享柱塞等等，我发现下面是我在index.html中需要解决的所有问题。

 <div ng-include src="'Scripts/tpl/optionTab.tpl.html'"></div>

在路径之前，我遗漏了单引号，而角形没有导入包含uib-tabset的部分html，因为它试图将路径解析为变量。使用单引号，它被视为字符串，并且起作用。感谢下面的帖子的帮助。

What is the correct syntax of ng-include?

Answer 2

你打错了。使用template-url属性而不是templateUrl。

template-url="Scripts/tpl/optionTab.tpl.html" 

Plunker