javascript - 在带有静态内容的angularjs引导选项卡上处于事件状态

我正在使用Angular Bootstrap UI来显示带有静态内容的选项卡集。

我对此感到沮丧，因为UI Bootstrap选项卡文档仅显示导航到通过ng-repeat绑定(bind)创建的选项卡。

    <uib-tabset>
        <uib-tab heading="Basic Details">
            <div role=" tabpanel" class="tab-pane active" id="basicDetails">
            tab1
            <button class="btn btn-success" ng-click="$parent.tabs[1].select()">Go to Tab 3</button>
            </div>
        </uib-tab>
        <uib-tab heading="Basic Details">
            <div role=" tabpanel" class="tab-pane active" id="basicDetails">
            tab2
            </div>
        </uib-tab>
    </uib-tabset>

我发现听到Stackoverflow的声音，但这不适用于当前版本的Angular Bootstrap UI。

Plunker

最佳答案

要将选项卡设置为事件选项卡，您需要在作用域上将 bool 值标志设置为“true”，并将其与给定选项卡的active属性相关联。这看起来像

<uib-tabset>
    <uib-tab heading="Basic Details" active="tabOneActive">
        tab1
    </uib-tab>
    <uib-tab heading="Other Details" active="tabTwoActive">
       tab2
    </uib-tab>
</uib-tabset>

当tabOneActive设置为true时，将显示第一个标签