具有應用程序路由元素的深度路徑

這裏是代碼的重要組成部分：

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

我想提高我的應用程序結構清晰，這樣的設置就不會在根文件夾，但在用戶文件夾等。網址複製我的文件夾的結構。理想情況下，應用路由模式將類似於此：

模式=「/ {FOLDERPATH} /：頁」

然後我會用obserever會聽的RouteData改變，這將接受FOLDERPATH和頁面參數。那之後，我會懶加載適當的頁面：

var resolvedPageUrl = this.resolveUrl("/views/" + folderpath + page + '-view.html'); 
this.importHref(resolvedPageUrl, null, this._showPage404, true);

我知道它會被刪除應用路由元素和解析路線自己很容易實現，但我不知道是否有一個「官方」使用app-route組件獲取此行爲的方法。

在此先感謝，1月

來源

2016-11-19 Jan Beneš

總的想法是，你鏈接在一起的路線。因此，要達到你想要你有效，可能會做這樣的事情

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

---------另一個因素或許

<app-route 
    route="{{subRoute}}" 
    pattern="/:page" 
    data="{{subRouteData}}"></app-route>

當心什麼，有一點點的疑難雜症與此，因爲「頁面」app-route將匹配，而不管文件夾路徑實際是什麼，並且如果您將其分發到其他元素中，那麼您可能不希望它發生。

的解決方案是在subroute情況下擴展模式 - 像這樣

<app-route 
    route="{{subRoute}}" 
    pattern="/reports/:page" 
    data="{{subRouteData}}"></app-route>

和

<app-route 
    route="{{subRoute}}" 
    pattern="/appointments/:page" 
    data="{{subRouteData}}"></app-route>

來源

2016-11-20 10:47:41 akc42

謝謝回答。這種方法在應用程序路徑文檔中有描述，但我不知道Polymer開發人員選擇鏈接而不是集中解決方案的原因。我正在創建一個單頁面應用程序，我認爲它會給子頁面添加不必要的複雜性。不過，我是網絡開發的新手，所以也許還有一些我還沒有意識到的隱藏優勢。也許這是一個巨大的應用程序的優勢，但在一箇中等規模的應用程序似乎是矯枉過正。祝你有個美好的一天 –

如果你看看我的github倉庫，你會看到一個集中式（'akc-router'）和分佈式解決方案（'akc-route' - 這是基於'app-route'，但刪除了一些疑難雜症的）。我正在建立一個SPA，並開始使用'akc-router'，然後使用'page.js'（也是一個集中的解決方案 - 有一些早期的多播使用它），但我現在正在使用'akc-route'，一些真正好的能力，能夠控制嵌套在應用程序深處的自定義元素中的部分url。 – akc42

謝謝，我一定會看看。 –

具有應用程序路由元素的深度路徑

回答

相關問題