页面加载时默认显示第一个选项卡 [英] display first tab as default when page loads

问题描述

log.component.html:

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:

route.module.ts:

 { path: 'log', component: LogComponent, children: [
    { path: 'log1', component: Log1Component },
    { path: 'log2', component: Log2Component ,pathMatch: 'full' }
   ]
 }

我想在用户点击/log时将log1选项卡的内容默认加载，如何实现此功能，任何指针对于像我这样的初学者都是有用的.

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.

当前在单击log1时，它同时显示两个选项卡，当我单击第一个选项卡时，它显示tab1的内容，我需要将此tab1数据显示为默认值

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

推荐答案

可以吗?

 { path: 'log', component: LogComponent, children: [
    { path: '', component: Log1Component },
    { path: 'log1', component: Log1Component },
    { path: 'log2', component: Log2Component ,pathMatch: 'full' }
   ]
 }

这篇关于页面加载时默认显示第一个选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！