子路径

时间:2016-06-17 18:17:04

标签: polymer polymer-1.0

我想就此问你的帮助: 我有一个具有以下结构的应用程序:

路线:

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

问题在于我正在尝试将app-route元素用于应用程序路由:

  

<my-app>元素:

<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>

聚合物脚本是:

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);
      }

这项工作非常完美,当我进入应用程序my-application元素播出时,当我在url“/ admin”中写入时,应用程序会自动显示my-admin元素。 我想知道如何继续使用应用程序的其余部分,因为我需要在“my-admin”元素中完全相同,默认情况下显示“my-adminlogin”,如果我写“/ admin / workplace”显示我的工作场所元素。 我真的不知道是否必须在<app-route>元素中创建一个新的<my-admin>元素,或者我是否必须使用子路由,但在这种情况下我找不到使用子路由的方法爱好。

感谢您的任何帮助,谢谢。

1 个答案:

答案 0 :(得分:2)

您必须将子路径传递给<my-admin>

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

然后它成为<my-admin>

内的主要路线