Matches more than one route?

[diegohaz]

Is there any way to make the component matches more than one path (like a switch case without break)?

For example, say I have these routes:

<app-router trailingSlash="ignore">
  <app-route path="/posts/:postId" import="pages/post-view.html"></app-route>
  <app-route path="/posts/**" import="pages/post-list.html"></app-route>
</app-router>

When /posts, I want to page renders only post-list; When /posts/:postId, I want to page renders post-view, but keeps post-list, even if /posts wasn't the last selected route.

Is this possible?

[diegohaz]

I think it should be something like:

<app-router trailingSlash="ignore" multipath>
  <app-route path="/posts/:postId" import="pages/post-view.html"></app-route>
  <app-route path="/posts/**" import="pages/post-list.html" persist></app-route>
</app-router>

multipath attribute to match more than one app-route; persist attribute to keep element's state (append once matched and don't remove DOM for this route).

[erikringsmuth]

The biggest issue would be making it work with the core-animated-pages feature since it expects only 1 page selected at a time.

Is this something that would work with multiple nested routers like this?

<app-router>
  <app-route path="/posts/**" import="pages/post-list.html"></app-route>
</app-router>

<polymer-element name="post-list" noscript>
  <template>
    <app-router>
      <app-route path="/posts/:postId" import="pages/post-view.html"></app-route>
    </app-router>
  </template>
</polymer-element>

Although this also seems like overkill or weird.

[diegohaz]

It would work, but, yes, it's weird. Perhaps if I could access just the ** part inside the element (as described in #70), it would work too.