Can you allow multiple route paths to match

iamaword 0
Viewed 38

I've been asked to make an app take in an optional first path segment and behave the same with/without it.

The app is a typical router-based lazy loaded angular app, and ideally I can implement some sort of middleware to allow the path to parse out the first segment( if it's a particular string, let's say 'foo') . I haven't found anything so far, but hoping something exists.

Example of desired behavior: the /foo would be optional and the router would only care about/implement the second set of routes (without /foo)

/foo/bar
/foo/bar/todo

/bar
/bar/todo
url routes javascript angular
2 Answers

It turns out you can just add an additional route to match it pretty simply:

const routes = [... your routes ...]
imports: [RouterModule.forRoot([
    {
        path: 'foo',
        children: routes
    },
    ...routes])],

EDIT --- Turns out, if you set up your app build to use --base-href='/foo/', angular ignores the given base href when it does it's routing. So in the app '/foo/bar' only needs to match a router path of '/bar'.

iamaword0

You can use redirectTo

[{
    path: 'foo/bar/:todo',
    redirectTo: '/bar/:todo'
}, {
    path: 'bar/:todo',
    component: BarComponent
}]
Eric Hall0
Related