标签: angular-ui-tabset

我在这个代码中使用AngularUI:

<uib-tabset type="pills">
    <uib-tab heading="Tab 1">Tab 1 content</uib-tab>
    <uib-tab heading="Tab 2">Tab 2 content</uib-tab>
</uib-tabset>

我想以编程方式更改角度控制器代码中的当前活动标记.例如,选择选项卡"2"作为活动.

怎么做到这一点？

在angularjs项目中,我使用uib-tabset指令来显示选项卡.我想显示所有标签共有的左侧面板.所以我必须在uib-tabset指令之前或之后添加一个div.

默认情况下,标题部分直接位于标签主体的顶部.

在生成的结构中,我想将选项卡包含在选项卡内(可视化):

使用uib-tabsets,生成的结构如下所示:

<panel>
<tabs-headings>
<tabs-bodies>

使用这种结构,我找到的唯一方法是编辑css并使用位置属性(左/上)进行播放,以便将标题移动到侧面板的顶部,但我发现这有风险.另一种方法是复制每个选项卡内的面板代码,但我发现这也很糟糕.

相反,我想生成这个,所以创建css会更容易:

<tabs-heading>
<panel>
<tabs-bodies>

有没有一种简单的方法来实现这种行为？

谢谢

我在使用选项卡内部的链接时遇到了问题,这些链接会更改视图并替换选项卡.仅在选项卡中使用ng-repeat但在静态选项卡中不使用时才会出现此问题.

那是主页:

<div  ui-view name="pageContent">
<uib-tabset>
    <uib-tab ng-repeat="tab in tabs" heading="{{tab.name}}"  active="tab.active" ng-click="!tab.disable && load(tab.link,tab.id)">
    </uib-tab>
    <!-- <uib-tab heading="Static title">Static content</uib-tab>
    <uib-tab heading="Static title">Static content 2</uib-tab> <!-- when I use the comment code it works. -->
    </uib-tabset>
    <div>
        <a class="btn btn-link" ui-sref="xxxx.yyyyy" role="button">
            {{$storage.aaaa.bbbbb}}
        </a><!-- this view replace the pageContent -->
    </div>
</div>

错误是:

错误:[$ compile:ctreq]无法找到指令'uibTab'所需的控制器'uibTabset'!

提前致谢