I need to ensure that the sidenav loads the basic page during the initial load. This is controlled by the routing.ts file shown below:
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MapGuard } from 'src/app/shared/guards/map.guard';
import { CampaignReportsComponent } from './campaign-reports.component';
const routes: Routes = [
{
path: '',
component: CampaignReportsComponent,
data: { breadcrumb: 'Campaign-report' },
redirectTo:'/basic',
children: [
{
path: 'type',
loadChildren:
'./campaign-reports-type/campaign-reports-type.module#CampaignReportsTypeModule',
canActivate: [MapGuard],
data: { breadcrumb: 'Type' }
},
{
path: 'basic',
loadChildren:
'./campaign-reports-basic/campaign-reports-basic.module#CampaignReportsBasicModule',
data: { breadcrumb: 'Basic' }
},
{
path: 'activity',
loadChildren:
'./campaign-reports-activity/campaign-reports-activity.module#CampaignReportsActivityModule',
data: { breadcrumb: 'Activity' }
},
{
path: 'rewards',
loadChildren:
'./campaign-reports-rewards/campaign-reports-rewards.module#CampaignReportsRewardsModule',
data: { breadcrumb: 'Rewards' }
},
{
path: 'winners',
loadChildren:
'./campaign-reports-winners/campaign-reports-winners.module#CampaignReportsWinnersModule',
data: { breadcrumb: 'Winners' }
}
]
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class CampaignReportsRoutingModule {}
However, an error is encountered stating
Cannot match any routes. URL Segment: 'basic'How can this issue be resolved? Any suggestions or insights are greatly appreciated.