Nested routing

[Anton S]

My structure

App page

        <app-location route={{route}}></app-location>
        <app-route route="{{route}}" pattern="/:page" data="{{data}}" tail="{{subroute}}"></app-route>


                <neon-animated-pages attr-for-selected="id" selected="{{data.page}}">
                    <foo-page id="foo" route="{{subroute}}"></foo-page>=
                    <bar-page id="bar" route="{{subroute}}"></bar-page>
                </neon-animated-pages>

foo page

        <app-route route="{{route}}" pattern="/:subpage" data="{{data}}"></app-route>

                <neon-animated-pages attr-for-selected="id" selected="{{data.subpage}}" fallback-selection="not-found">
                ...
                </neon-animated-pages>

bar page

        <app-route route="{{route}}" pattern="/:subpage" data="{{data}}"></app-route>

Problem:

Redirect from /bar/some-url to /bar/not-found because of fallback-selection in foo-page