I am implementing ion-tabs.
One Parent Page and under it 5 tabs.
Every-time when I come on parent page I have to tap on first tab and then it get open.
I want that when I land on parent page then by default first tab should open.
How can I achieve that.
Code in ParentPage.html
<ion-content padding>
<ion-tabs>
<ion-tab-bar slot="bottom">
<ion-tab-button tab="tab1">
<ion-icon name="folder"></ion-icon>
</ion-tab-button>
<ion-tab-button tab="tab2">
<ion-icon name="folder"></ion-icon>
</ion-tab-button>
<ion-tab-button tab="tab3">
<ion-icon name="folder"></ion-icon>
</ion-tab-button>
<ion-tab-button tab="tab4">
<ion-icon name="folder"></ion-icon>
</ion-tab-button>
<ion-tab-button tab="tab5">
<ion-icon name="folder"></ion-icon>
</ion-tab-button>
</ion-tab-bar>
</ion-tabs>
</ion-content>
ParentPage.Module.ts
const routes: Routes = [
{
path: 'tabs/:id',
component: ParentPage,
children:
[
{
path: 'tab1',
children:
[
{
path: '',
component: Tab1Component
}
]
},
{
path: 'tab2',
children:
[
{
path: '',
component: Tab2Component
}
]
},
{
path: 'tab3',
children:
[
{
path: '',
component: Tab3Component
}
]
},
{
path: 'tab4',
children:
[
{
path: '',
component: Tab4Component
}
]
},
{
path: 'tab5',
children:
[
{
path: '',
component: Tab5Component
}
]
},
{
path: '',
redirectTo: '/tabs/tab1',
pathMatch: 'full'
}
]
},
{
path: '',
redirectTo: '/tabs/tab1',
pathMatch: 'full'
}
];
Where I am doing mistake.
Thanks