Ion-Tabs Sub Lazy Load Not routing

Hi all,
I have encountered a strange behavior and I do not know if it is a bug or it is something I am missing. The situation is as follows:

I have a <ion-tabs></ion-tabs> setup in a dashboard.page.html file. With that I have the following route in dashboard-routing.module.ts:

const routes: Routes = [
	{
		path: "",
		component: DashboardPage,
		children: [
      {
        path: "insight",
        loadChildren: () =>
          import("./insight/insight.module").then(
            (m) => m.InsightPageModule
          )
      },
]

When clicked on the tab I get the Insight page. This works all good. In the Insight routing module I have the following route:

const routes: Routes = [
	{
		path: "",
		component: InsightPage,
		children: [
      {
      	path: "hauls",
      	canActivate: [RoleGuard],
      	loadChildren: () =>
      		import("./pages/hauls/hauls.module").then(
      			(m) => m.HaulsPageModule
      		),
    },

And in the insight.page.html:

<ion-content>
	<ion-grid>
		<ion-row>
			<ion-card routerLink="hauls">
				<ion-item>
					<ion-icon name="glyph-water" slot="start"></ion-icon>
					<ion-label>Trekken</ion-label>
					<ion-button fill="outline" slot="end">View</ion-button>
				</ion-item>

				<ion-card-content>
					This is content, without any paragraph or header tags,
					within an ion-card-content element.
				</ion-card-content>
			</ion-card>
		</ion-row>
	</ion-grid>
</ion-content>

Now when I click on the card the url in the bar changes. But I do not route to the page. I have searched around and I found that it had something to do with the router outlet. I did find a solution but I is not as clean as a the above described scenario. What is did was add a route in the dashboard-routing.module.ts, which is:

  {
        path: "insight/hauls",
        loadChildren: () =>
          import("./insight/pages/hauls/hauls.module").then(
            (m) => m.HaulsPageModule
          )
      }

So basically my problem is that I can not route when I define the route in a child module. Does anyone here has encountered the same problem?

Thanks in advance!

Ruben

1 post - 1 participant

Read full topic