CODEWITHSUNDEEP
angular-routingangular8angular-router
Lars
Lars

Reputation: 1092

Problem to route to different components with Angular 8

What I'm trying to do is to route to different components via the same path but it wont work.

/schedule -> shall load the ScheduleComponent
/schedule/123 -> shall load the EventComponent ('123' is a dynamic path, so that it is not an option to write it to children's path)

Here is the code:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { ScheduleComponent }    from './schedule.component';
import { EventComponent }       from '@app/modules/event/event.component';

const routes: Routes = [
{
    path: '', 
    component: ScheduleComponent,
    children: [
        { 
            path: '**', 
            component: EventComponent 
        }
    ]
}
];

@NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule]
})
export class ScheduleRoutingModule { }

But I'm doing something wrong and cannot find the mistake, because the EventComponent is called in any case, even if there is no additional path given. What is wrong with my code?

Thx!

Upvotes: 0

Views: 23

Answers (1)

pontusv
pontusv

Reputation: 291

You have not specified any routes in your code example. The '**' path that you set is used for "page not found", in case a user navigates to a non existing route.

More on routes can be found in the official documentation

 const routes: Routes = [
       { path: '/schedule', component: ScheduleComponent },
       { path: '/schedule/:id', component: EventComponent },
    ];

Upvotes: 1

Related Questions