CODEWITHSUNDEEP
polymerpolymer-1.0
Jose Raul Perera
Jose Raul Perera

Reputation: 878

Polymer app-route issue with subroutes

I would like to ask for your help on this: I have an application that have the following structure:

Routes:

<my-app>
    - <my-application>
    - <my-admin>
          - <my-adminlogin>
          - <my-workplace>

The problem is that I'm trying to use app-route element for the app routing:

<my-app> element:

<app-location route="{{route}}"></app-location>
    <app-route
        route="{{route}}"
        pattern="/:page"
        data="{{routeData}}"
        tail="{{subroute}}">
    </app-route>
    <iron-pages role="main" selected="[[page]]" attr-for-selected="name">
        <my-application name="application"></my-application>
        <my-admin name="admin"></my-admin>
    </iron-pages>

The polymer script is:

properties: {
        page: {
          type: String,
          reflectToAttribute: true,
          observer: '_pageChanged'
        },
      },
      observers: [
        '_routePageChanged(routeData.page)'
      ],
      _routePageChanged: function(page) {
        this.page = page || 'application';
      },
      _pageChanged: function(page) {
        // load page import on demand.
        this.importHref(
          this.resolveUrl('my-' + page + '.html'), null, null, true);
      }

This work perfect when I enter to app the my-application element sows up and when I write in the url "/admin" the app automatically show up my-admin element. I'm wonder how to keep going with the rest of the app because I need to do exactly the same in "my-admin" element to show by default "my-adminlogin" and if I write "/admin/workplace" show the my-workplace element. I really don't know if I have to create a new <app-route> element in the <my-admin>element or if I have to use subroutes, but in that case I din't find a way to use the subroutes yet.

I appreciate any help on this, thanks.

Upvotes: 1

Views: 1648

Answers (1)

inigo
inigo

Reputation: 48

You have to pass in the subroute to <my-admin>

<my-admin name="admin" route={{subroute}}></my-admin>

It then becomes the main route inside <my-admin>

Upvotes: 2

Related Questions