A default parent router with child routers - aurelia

Question

Consider the following two classes:
import { Router, RouterConfiguration } from 'aurelia-router';
export class MainPage
{
router: Router;
configureRouter(config: RouterConfiguration, router: Router)
{
config.map([
{ route: ['', 'entities'], name: 'entities', moduleId: './entities/entities', nav: true, title: 'Entities' },
{ route: 'structures', name: 'structures', moduleId: './structures/structures', nav: true, title: 'Data Structures' },
]);
this.router = router;
}
}
And
import { Router, RouterConfiguration } from 'aurelia-router';
export class Entities
{
private router: Router;
configureRouter(config: RouterConfiguration, router: Router)
{
config.map([
{ route: '', name: 'entities-list', moduleId: './list', nav: true, title: 'Entities' },
{ route: 'events', name: 'entity-events', moduleId: './events', nav: true, title: 'Events' },
]);
this.router = router;
}
}
The problem is that; in a page where the URL reads: http://localhost/ when I execute:
this.router.navigateToRoute('entity-events');
I get the error ERROR [app-router] Error: Route not found: events. But if I change the MainPage class to this:
import { Router, RouterConfiguration } from 'aurelia-router';
export class MainPage
{
router: Router;
configureRouter(config: RouterConfiguration, router: Router)
{
config.map([
{ route: 'entities', name: 'entities', moduleId: './entities/entities', nav: true, title: 'Entities' },
{ route: 'structures', name: 'structures', moduleId: './structures/structures', nav: true, title: 'Data Structures' },
]);
this.router = router;
}
}
In a page that URL reads http://localhost/entities, I can successfully execute the given navigateToRoute command. But then I'll lose the root route!
So how can I have a parent router with a default route and some child routes under the default route?

Answer 1

How about using a redirect route to redirect the default route to entities? I'm on mobile right no, so no code sample, but the docs should explain it.