Angular2 routing with lazy modules

Question

I try to figure out how to configure routing in my application with lazy loaded modules.

For instance I have a lazy module called AnimalsModule, and I want that this module handle 2 routes "/cats" and "/dogs".

In current router api I need to specify common path for all lazy module routes, like: 'animals/dogs' and 'animals/cats'.

{
   path: "animals",
   loadChildren: "animals"
}

I can specify empty path for AnimalsModule:

{
    path: "",
    loadChildren: "animals"
},
{
   path: "foo",
   component: FooComponent
}

But in this case AnimalsModule will be unnecessary loaded when user navigates to "/foo" resource.

If I create 'animals/cats' and 'animals/dogs' routes and in the future I want to refactor my code to split AnimalsModule into DogsModule and CatsModule (also lazy), I will have to break my application routes. (same for merge)

How to create routing with lazy module without common path?

Answer 1

路由具有一个称为matcher property see docs的属性，您可以在其中提供自己的路由匹配逻辑，但是正如在问题注释中所述，我实际上是创建2条路由，甚至将它们分成2个模块（更有可能）。