When using templates to build routes/pages , failes to add routes.

[jclx]

Thanks for the lazy loader. Exactly what we were looking for.

We are using a template repeats to build our routes and pages from an ajax call.
The plastik-lazy-route-selector updates routes on attach and sometimes the repeating templates haven't fired yet so there are no routes to update. Maybe we are doing something wrong. In our code we ended up calling selector.attach() manually to get routes to update. I tweaked the demo index.html to use templates but I wasn't able to use our work around the issue. I might have missed something from our implementation. But it should be close. Maybe listening for route/page changes instead of updating on attach.

  <template id="t" is="dom-bind">

    <iron-ajax url="pages.json" last-response="{{data}}" auto></iron-ajax>

    <more-routing-config driver="hash"></more-routing-config>

    <more-route name="root" path="/">
      <template is="dom-repeat" items="[[data]]" as="item">
        <more-route name$="{{item.name}}" path$="{{item.path}}"></more-route>
      </template>
    </more-route>

    <paper-drawer-panel>

      <paper-header-panel drawer>

        <paper-toolbar>
          <div>My App</div>
        </paper-toolbar>

        <paper-menu attr-for-selected="route" selected="{{route}}">
          <paper-item route="root">Home</paper-item>
          <template is="dom-repeat" items="[[data]]" as="item">
            <paper-item route$="{{item.id}}">{{item.label}}</paper-item>
          </template>
        </paper-menu>

      </paper-header-panel>

      <plastik-lazy-route-selector main id="selector" selected="{{route}}">
        <neon-animated-pages attr-for-selected="route" class="fit" entry-animation="fade-in-on-top-animation" on-paper-drawer-toggle="toggleDrawer">
          <neon-animatable route="root" import="myapp-home.html"></neon-animatable>
          <template id="ptemplate" is="dom-repeat" items="[[data]]" as="item">
            <neon-animatable route$="{{item.name}}" template$={{item.template}}" element$="{{item.element}}"  import$="{{item.page}}"></neon-animatable>
          </template>
        </neon-animated-pages>
      </plastik-lazy-route-selector>

    </paper-drawer-panel>

  </template>

And a json file:

[
  {
    "id": "users",
    "name": "users",
    "path": "/users",
    "label": "Users",
    "element": "myapp-users-page",
    "page": "myapp-users.html"
  },
  {
    "id": "help",
    "name": "help",
    "path": "/help",
    "label": "Help",
    "template": "true",
    "page": "myapp-help.html"
  }
]