页面加载时默认显示第一个选项卡
[英] display first tab as default when page loads
本文介绍了页面加载时默认显示第一个选项卡的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
log.component.html:
<clr-tab><button style="margin-left: 3% !important;"clrTabLink [routerLink]="'log1'">Log1<ng-template [(clrIfActive)]="log1"><clr-tab-content><div class="main-container"><div class="content-container"><div class="content-area"><路由器插座></路由器插座>
</clr-tab-content></ng-模板></clr-tab><clr-tab><button style="margin-left: 3% !important;"clrTabLink [routerLink]="'log2'">Log2</button><ng-template [(clrIfActive)]="log2"><clr-tab-content><div class="main-container"><div class="content-container"><div class="content-area"><路由器插座></路由器插座>
</clr-tab-content></ng-模板></clr-tab>
route.module.ts:
{ path: 'log', component: LogComponent, children: [{ 路径:'log1'，组件:Log1Component }，{ 路径:'log2'，组件:Log2Component，路径匹配:'完整' }]}
我想在用户点击/log 时默认加载 log1 选项卡内容，如何使用此功能，任何指针对像我这样的初学者都有用.
当前点击log1时，它显示两个选项卡，当我点击第一个选项卡时，它显示tab1的内容，我需要这个tab1数据显示为默认
解决方案
那行得通吗?
{ path: 'log', component: LogComponent, children: [{ 路径:''，组件:Log1Component }，{ 路径:'log1'，组件:Log1Component }，{ 路径:'log2'，组件:Log2Component，路径匹配:'完整' }]}
log.component.html:
<clr-tabs>
<clr-tab>
<button style="margin-left: 3% !important;" clrTabLink [routerLink]="'log1'">Log1</button>
<ng-template [(clrIfActive)]="log1">
<clr-tab-content>
<div class="main-container">
<div class="content-container">
<div class="content-area">
<router-outlet></router-outlet>
</div>
</div>
</div>
</clr-tab-content>
</ng-template>
</clr-tab>
<clr-tab>
<button style="margin-left: 3% !important;" clrTabLink [routerLink]="'log2'">Log2</button>
<ng-template [(clrIfActive)]="log2">
<clr-tab-content>
<div class="main-container">
<div class="content-container">
<div class="content-area">
<router-outlet></router-outlet>
</div>
</div>
</div>
</clr-tab-content>
</ng-template>
</clr-tab>
route.module.ts:
{ path: 'log', component: LogComponent, children: [
{ path: 'log1', component: Log1Component },
{ path: 'log2', component: Log2Component ,pathMatch: 'full' }
]
}
I want to load log1 tab content as default when user hits /log,how to approach this functionality,any pointers will be useful for a beginner like me.
currently while clicking on log1,it displays both tabs and when i click on first tab it displays the content of tab1,i need this tab1 data display as default
解决方案
Does that work?
{ path: 'log', component: LogComponent, children: [
{ path: '', component: Log1Component },
{ path: 'log1', component: Log1Component },
{ path: 'log2', component: Log2Component ,pathMatch: 'full' }
]
}
这篇关于页面加载时默认显示第一个选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
