角度材质md-tabs中是否有任何属性可以禁用类似于Bootstrap中的选项卡。
$scope.tabs = [{
title: 'Dynamic Title 1',
content: 'Dynamic content 1'
}, {
title: 'Dynamic Title 2',
content: 'Dynamic content 2',
disabled: true
}];
这样的东西?
<div class="col-lg-12 col-md-12">
<md-card-content id="nvd3-scrollable-content" style="height: 350px;">
<md-tabs md-dynamic-height md-border-bottom md-selected="selectedTab">
<md-tab ng-repeat="data in trendData" label="{{data.name}}">
<md-content class="md-padding" >
<div ng-if="data.name == 'FirstTab'">
<!-- some code-->
</div>
<div ng-if="data.name == 'SecondTab'">
<!-- some other code-->
</div>
</md-content>
</md-tab>
</md-tabs>
</md-card-content>
</div>
答案 0 :(得分:0)
在角度材质中有一个属性'md-selected',您可以通过设置md-selected =“selectedTabIndex”使用它,让我告诉你:
<md-tabs md-selected="selectedTabIndex" md-dynamic-height md-border-bottom md-center-tabs="true" md-stretch-tabs='always'>
<md-tab label="all" md-on-select="changeTab()">
<md-content class="md-padding" flex>
<attendance-listing-content></attendance-listing-content>
</md-content>
</md-tab>
<md-tab label="present" md-on-select="changeTab()">
<md-content class="md-padding">
<attendance-listing-content></attendance-listing-content>
</md-content>
</md-tab>
<md-tab label="absent" md-on-select="changeTab()">
<md-content class="md-padding">
<attendance-listing-content></attendance-listing-content>
</md-content>
</md-tab>
</md-tabs>
然后从你的控制器你只需要定义 $ scope.selectedTabIndex ='1'; ,那么在那种情况下,第一个标签将显示或激活,而其他标签相同。
答案 1 :(得分:0)