我正在努力获得一些基本路线。我使用的是Polymer 1.5.0,我在使用嵌套路由方面遇到了问题。
我正在使用app-route 0.9.2
作为this post suggests,Polymer在路由中使用分散方法。因此我决定做以下事情:
<app-route route="{{route}}"
pattern="/:page"
data="{{data}}"
tail="{{tail}}">
</app-route>
<iron-pages selected="{{data.page}}" attr-for-selected="title" fallback-selection="404">
<pgarena-home-app title="" route="{{tail}}" ></pgarena-home-app>
<pgarena-tournament-app title="tournament" route="{{tail}}"></pgarena-tournament-app>
<pgarena-account-app title="account" route="{{tail}}"></pgarena-account-app>
<div title="404">
<h1>{{data.page}} could not be found!</h1>
</div>
</iron-pages>
子页面:
pgarena-帐户应用
<iron-pages selected="{{data.action}}" attr-for-selected="title" fallback-selection="404">
<pgarena-account-index-view title=""></pgarena-account-index-view>
<pgarena-account-login-view title="login"></pgarena-account-login-view>
<pgarena-account-register-view title="register"></pgarena-account-register-view>
<div title="404">
<h1>Not found :(</h1>
</div>
</iron-pages>
pgarena-比赛应用内
<!-- Chooses the new tournament page. -->
<app-route
route="{{route}}"
pattern="/:action"
data="{{data}}"
tail="{{tail}}"
>
</app-route>
<iron-pages selected="{{data.action}}" attr-for-selected="title" fallback-selection="404">
<pgarena-tournament-index-view title=""></pgarena-tournament-index-view>
<!-- The list of all the tournaments -->
<pgarena-tournament-list-view title="list"></pgarena-tournament-list-view>
<div title="404">
<h1>Not Found!</h1>
</div>
</iron-pages>
一切似乎都好,对吗?根据URL,我在这里做的是利用Lazy Load of elements。
我在Polycasts examples中看到他们使用&#34;隐藏&#34;做法。他们在其中选择元素。问题是我们失去了'懒惰装载优势&#34;。
可能有什么不对?
答案 0 :(得分:4)
OMG!我完全忘记了。 In Polycasts #46/47 Rob Dodson强调强调,当使用铁选择器时,我们应该传递单向绑定,它带有方括号[]
与大括号{}
所以在一天结束时应该是:
<iron-pages selected="[[data.action]]"
而不是:
<iron-pages selected="{{data.action}}"