Angular 2 routes resolve different component

Viewed 1162

Here is my use case:

When i load url /product/123 i want to load component ProductComponent

This is my setup:

RouterModule.forRoot([            
        {
            path: 'product/:productId',
            component: ProductComponent
        },
        {
            path: '**', component: NotFoundComponent
        },
    ]),

Now I have added a resolver to check if that product id exists, so my setup looks like this:

RouterModule.forRoot([            
        {
            path: 'product/:productId',
            component: ProductComponent,
            resolver: {
                productResolver: ProductResolver
            }
        },
        {
            path: '**', component: NotFoundComponent
        },
    ]),

My resolver checks if that productId parameter exists via api call. The problem i have is that when productId is not found I want to load NotFoundComponent rather than redirecting to different page (i dont want to change url like angular 2 documentation suggests).

Anyone knows how to do that? if not productId found via resolver load NotFoundComponent without changing url/navigate?

3 Answers
Related