Angular Routing to different paths for one component

Question

I have a page called http://example.com/consultation which represents the landing page (first page) of angular in my site, and the routes are as shown below. The Question is: when the link is http://example.com/consultation (without anything after consultation i need to distribute routing randomly to ask-question and service-page. Any idea how to achieve this?

export const routes: Routes = [
    {
        path: 'consultation',
        component: OnlineConsulationComponent,
        children: [
            { path: '', redirectTo: 'ask-question', pathMatch: 'full' },
            { path: 'ask-question', component: AskQuestion },
            { path: 'service-page', component: ServicePage },
            { path: '**', redirectTo: 'ask-question' }
        ]
    }
];

Answer 1

Your redirects should have a slash in front

redirectTo: '/ask-question'

Answer 2

I would do it from the OnlineConsultationComponent ngOnInit function. Just check the route there and if you don't detect 'ask-questions' or 'service-page' inside the active route, then reroute to one of those two chosen randomly. There is no way of doing this through the router directly.

You can also achieve this same behavior with a guard if you don't want to dont want to do it inside the component.