[英]how to set active on angularjs bootstrap tab
我正在使用Angular Bootstrap UI来显示带有静态内容的tabset(使用AngularUI bootstrap)。 以下是说明我的问题的plunker链接http://plnkr.co/edit/n8Xp3GrAqlbNxZ7VrXR6?p=preview
问题是如果我想将第一个选项卡设置为不可见而第二个选项卡可见,它仍然将第一个选项卡内容显示为活动状态。
我尝试在选项卡上应用活动的css,但它不起作用:
<tabset>
<tab ng-show="$parent.hideme" ng-class="{active:$parent.hideme}">
<tab-heading>
tab1
</tab-heading>
<div>
tab content 1
</div>
</tab>
<tab ng-hide="$parent.hideme" ng-class="{active:!$parent.hideme}">
<tab-heading>
tab2
</tab-heading>
<div>
tab content 2
</div>
</tab>
</tabset>
有什么想法来解决这个问题吗?
即使是一个老问题。 我有一个相当类似的问题,并使用ng-init
来设置active
属性。
使用提供的代码:
<div ng-init="activeTab = true">
<tabset>
<tab ng-show="$parent.hideme" ng-class="{active:$parent.hideme}">
<tab-heading>
tab1
</tab-heading>
<div>
tab content 1
</div>
</tab active="activeTab">
<tab ng-hide="$parent.hideme" ng-class="{active:!$parent.hideme}">
<tab-heading>
tab2
</tab-heading>
<div>
tab content 2
</div>
</tab>
</tabset>
</div>
当然,不是使用ng-init
, activeTab
可以在控制器中初始化activeTab
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.