聚合物，链式应用路由元件上改变路线

Question

我使用从https://github.com/PolymerElements/app-route该应用路由元件上具有以下结构的一个项目：

包含以下代码甲my-app元件：

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

<iron-pages selected="[[page]]" attr-for-selected="name"> 
    <store-main-page 
    name="loja" 
    route="{{subroute}}" 
    categories="[[categories]]"> 
    </store-main-page> 
    ... 
</iron-pages> 
... 

一个store-main-page元素有：

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

<iron-pages selected="[[page]]" attr-for-selected="name"> 
    <category-page 
    name="categoria" 
    route="{{subroute}}" 
    selected-category="{{selectedCategory}}" 
    cart="{{cart}}"> 
    </category-page> 
    ... 
</iron-pages> 
... 

因此，访问/路径的欢迎页面将显示一个nd访问/loja/categoria，my-app将调用store-main-page，这将调用category-page。

我的问题是，我想在显示store-main-page之前对用户进行身份验证，如果用户未通过身份验证，请将其重定向到/上的欢迎页面。有没有办法使用app-route来做到这一点？

我发现用app-route是调用

this.set('route.path', 'path'); 

改变页面但这并不上链路线的工作，在我的情况的唯一方法，这将导致对重定向到/loja/路径，这是不是有什么我想要。

如何更改父元素上的路线？那可能吗？

Answer 1

我刚才发现app-location只是iron-location和app-route之间的接口。

所以我解决了这个问题，添加一个iron-location到我的子元素，并更改其path属性。

确切的代码是：

<iron-location id="ironLocation"></iron-location> 
... 
</template> 

<script> 
... 
    attached: function() {      
    if (!userAuth()) {    
     this.$.ironLocation.set('path', '/');    
    } else { 
     ... 
    }          
    } 
... 

我不知道这是否是理想的解决方案，但它的工作原理。