选择选项卡会导致页面随机滚动,例如选择选项卡可以将页面几乎一直滚动到顶部,然后我必须向下滚动才能看到选项卡的内容,如果我选择另一个选项卡页面再次滚动.
标签的内容大小可变,有些元素比其他元素多,所以它们自然具有不同的高度,但我不确定这是否是随机页面滚动的原因.
我尝试了一些jquery来禁用链接默认操作而没有运气.
$(function () {
$('body').on('click','a[ng-click="select()"]',function (event) {
event.preventDefault();
});
});
另一个丑陋的解决方案是我将tabset包装在div中并在div上设置一个高度
<div class="col-md-12" id="profile-nav-tabs" style="
height:500px;
overflow-y: auto;
overflow-x:hidden
">
<tabset justified="true">
<tab heading="{{::strings.profile}}">
<br />
<div ng-include="'tab-profile.PHP'"></div>
</tab>
.... more tabs
</tabset>
</div>
我遇到了同样的问题.在跟踪代码之后,我认为这是tabset指令的错误.
解决方案是(一步一步):
>修改tabset.html,删除[ng-class =“{active:tab.active}”]
>修改[tab]指令的范围.$watch(‘active’)的处理程序.
>使用angular.element的addClass和removeClass函数添加/删除活动类.
link: function(scope,elm,attrs,tabsetCtrl,transclude) {
scope.$watch('active',function(active) {
/*if (active) {
tabsetCtrl.select(scope);
}*/
var idx = tabsetCtrl.tabs.indexOf(scope);
var elmPane = angular.element(elm[0]).parent().next().children()[idx]; //li->ul->div(tab-content)->div(tab-pane)
if (active) {
tabsetCtrl.select(scope);
angular.element(elmPane).addClass('active');
}
else {
angular.element(elmPane).removeClass('active');
}
});