I am facing an issue with routing in my dashboard module. Specifically, I am trying to navigate to the WhatsAppConversationComponent using routes defined in the DashboardRoutes, but it is not working as expected.
Within my Dashboard module, I have declared various components including WhatsAppConversationComponent:
@NgModule({
imports: [
CommonModule,
RouterModule.forChild(DashboardRoutes),
FormsModule,
MdModule,
MaterialModule
],
declarations: [
DashboardComponent,
SurveyComponent,
QuestionnaireComponent,
SurveyReportComponent,
WhatsAppConversationComponent
]
})
export class DashboardModule { }
The DashboardRoutes array contains routes for different components including WhatsAppConversationComponent:
export const DashboardRoutes: Routes = [
{
path: '',
children: [{
path: 'dashboard',
component: DashboardComponent
}, {
path: 'questionnaire',
component: QuestionnaireComponent
}, {
path: 'survey',
component: SurveyComponent
}, , {
path: 'whatsappconversation',
component: WhatsAppConversationComponent
}, {
path: 'survey-report',
component: SurveyReportComponent
}]
}
];
However, when I attempt to navigate to /whatsappconversation route, the following error occurs:
core.js:3838 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'outlet' of undefined
TypeError: Cannot read property 'outlet' of undefined
at getOutlet (router.js:2822)
...
This error prevents the WhatsAppConversationComponent from loading on the UI.