anglejs – Angular UI Bootstrap标签集包含

前端之家收集整理的这篇文章主要介绍了anglejs – Angular UI Bootstrap标签集包含前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我无法使用ng-include设置动态内容的选项卡.
我尝试使用ng-repeat失败:
<tabset justified="true">
    <tab ng-repeat="tab in tabs" heading="{{ tab.heading }}" active="tab.active">
         <div ng-include="tab.template"></div>
    </tab>
</tabset>

另外,我没有ng-repeat尝试:

<tabset justified="true">
    <tab heading="{{ tabs.1.heading }}" active="tabs.1.active">
         <div ng-include="'partial/profile/template1.html'"></div>
    </tab>
    <tab heading="{{ tabs.2.heading }}" active="tabs.2.active">
         <div ng-include="'partial/profile/template2.html'"></div>
    </tab>
    <tab heading="{{ tabs.3.heading }}" active="tabs.3.active">
         <div ng-include="'partial/profile/template3.html'"></div>
    </tab>
    <tab heading="{{ tabs.4.heading }}" active="tabs.4.active">
         <div ng-include="'partial/profile/template4.html'"></div>
    </tab>
    <tab heading="{{ tabs.5.heading }}" active="tabs.5.active">
         <div ng-include="'partial/profile/template5.html'"></div>
    </tab>
</tabset>

然而,我得到的是一个空白的页面,没有回应和这些错误

WARNING: Tried to load angular more than once.

10 $digest() iterations reached. Aborting!

FYI:模板主要是空的,不空的一个包含一个基本表.
我如何使其工作?

看起来你在使用ng-repeat时有额外的引号. ng-include =“’x.html’”中的额外引号仅在作为属性使用时才需要.

在JavaScript中将其指定为变量时,可以按如下方式在JavaScript中设置范围变量:$scope.someTemplateUrl =“x.html”;然后将属性设置为ng-include =“someTemplateUrl”.注意变量的值不包含单引号.

而第二个版本你应该做标签[0] .heading而不是tab.0.heading(从0而不是1开始).

我创建了一个包含工作版本的Plunker,它似乎正常工作:

http://plnkr.co/edit/cL9RPB4otw57pORJqjvx?p=preview

我做了什么:

>从模板属性删除额外的引号
>删除html5Mode,因为Plunker不工作.

所以这样的东西:

$scope.tabs = [
        {
            "heading": "Tab 1","active": true,"template":"tab1.html"
        },...

猜你在找的Angularjs相关文章