In an Aurelia app, I've defined a simple route like this:

```
configureRouter(config: RouterConfiguration, router: Router) {
    config.title = 'Marino';
    config.map([
        { route: ['', 'home'], name: 'home', moduleId: './pages/home/home', nav: true, title: 'Home' },
        { route: 'colors', name: 'colors', moduleId: './pages/colors/overview', nav: true, title: 'Colors' }
    ]);

    this.router = router;
}

```

This works perfectly as all the examples mention, by implementing repeat.for and href.bind like this:

```
<ul class="main-navigation">
    <li repeat.for="row of router.navigation" class="${row.isActive ? 'active' : ''}">
        <a class="btn btn-primary" href.bind="row.href">${row.title}</a> 
    </li>
</ul>

```

The challenge in my scenario is that I want to **dynamically render routes with submenu-items** to this menu as well. Something like this:

```
<ul class="main-navigation">

    <!-- the regular 'regular' menu and works just fine -->
    <li repeat.for="row of router.navigation" class="${row.isActive ? 'active' : ''}">
        <a class="btn btn-primary" href.bind="row.href">${row.title}</a> 
    </li>

    <!-- 
        below is the pickle; a different kind of element (non-clickable),
        but with child elements
    -->

    <li class="main-navigation-dropdown">
        <a class="btn btn-primary">Menu with Submenu-items</a> 
        <div class="horizontal-dropdown-menu">
            <a class="btn btn-primary sideline">Submenu 1</a> 
            <a class="btn btn-primary sideline">Submenu 2</a> 
            <a class="btn btn-primary sideline">Submenu 3</a> 
        </div>
    </li>                            
</ul>

```

What puzzles me are two things:

1. How do I properly define the submenu-items in the route config?
2. How can I conditionally render each route as either a regular (clickable) route, or as a non-clickable item with submenu's?

I've looked in the [RouteConfig docs](http://aurelia.io/docs.html#/aurelia/router/1.0.0-beta.1.2.2/doc/api/interface/RouteConfig) but can't seem to find any info on 'nested' subroutes. The [Aurelia Getting Started](http://aurelia.io/docs.html#/aurelia/framework/1.0.0-beta.1.2.4/doc/article/getting-started) does provide info about child routes, but all the samples seem to me to be related to displaying "other", or second menu's on another component.

I'm sure it's quite trivial, but I just can't seem to get a fix on it.