How to set router wildcard exceptions in an Angular 9 app?

user_9939844 0
Viewed 224

I know that it's possible to set wildcard routes in Angular, but how is it possible to set "wildcard exceptions"? My main routing scope looks like this and works great:

{
    ...
},
{
    path: '',
    component: HomeComponent,
},
{
    path: '**',
    component: NotFoundComponent,
}

But I also have a non-Angular component unter /admin. This admin-path is well configured in my nginx config and also works. But now comes the problem:

  1. open a new browser and access /admin -> admin works
  2. open a new browser and access / -> Angular app works
  3. open my app (2) and now modify the url in the address bar of the Chrome browser to /admin -> doesn't open my admin but NotFoundComponent

I guess that any caching mechanism of the browser and/or Angular is now activated, that it assumes that is an Angular component too. For that reason I'm looking for a way to tell the Angular router that /admin is NOT part of the Angular app and that the nginx-config has to be used.

How can I achieve this?

--- EDIT ---

I also tried the solution proposed here in the forum, which looks like this:

{
    path: 'admin',
    canActivate: [externalUrlProvider],
    component: NotFoundComponent,
},

@NgModule({
        ...
    providers: [
    {
        provide: externalUrlProvider,
        useValue: (route: ActivatedRouteSnapshot) => {
            let externalUrl = '/' + route.url.toString();
            window.open(externalUrl, '_self');
        },
    },
    ],
})

But this one results in an endless loop: open a window again and again ...

angular-routing angular
1 Answers

You can set exceptions to the wild-card route by adding the components which needed to be excluded or excepted above the wild-card route something like this -

  { path: "ComponentPath1" , component :  Component1},
  { path: "ComponentPath2" , component :  Component2},
  { path: '**', component: DefaultComponent},

In this case when you type in website.com/ComponentPath1 you will be redirected to the component "Component1" instead of being redirected to DefaultComponent.

user_152655740
Related