如何在聚合物2中使用app-route来获得深层路径（） _路径

【如何在聚合物2中使用app-route来获得深层路径（）】枕上诗书闲处好，门前风景雨来佳。这篇文章主要讲述如何在聚合物2中使用app-route来获得深层路径？相关的知识，希望能为你提供帮助。
这是聚合物应用入门套件代码的一部分。我刚刚在src中添加了一个my-news-list.html元素：

< app-location route="{{route}}"> < /app-location> < app-route route="{{route}}" pattern="/:page" data="https://www.songbingjia.com/android/{{routeData}}" tail="{{subroute}}"> < /app-route> < app-drawer-layout fullbleed> < !-- Drawer content --> < app-drawer id="drawer" slot="drawer"> < app-toolbar> Menu< /app-toolbar> < iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation"> < a name="news" href="https://www.songbingjia.com/news"> News< /a> < a name="view1" href="https://www.songbingjia.com/view1"> View One< /a> < /iron-selector> < /app-drawer> < !-- Main content --> < app-header-layout has-scrolling-region> < app-header slot="header" condenses reveals effects="waterfall"> < app-toolbar> < paper-icon-button icon="my-icons:menu" drawer-toggle> < /paper-icon-button> < div main-title> My App< /div> < /app-toolbar> < /app-header> < iron-pages selected="[[page]]" attr-for-selected="name" fallback-selection="view404" role="main"> < my-news-list name="news" route="{{subroute}}"> < /my-news-list> < my-view1 name="view1"> < /my-view1> < my-view404 name="view404"> < /my-view404> < /iron-pages> < /app-header-layout> < /app-drawer-layout>

一切都很好，

<
my-news-list>

和

<
my-view1>

在

<
iron-selector>

点击主题时正确加载。在

<
my-news-list>

元素我得到了

<
iron-ajax>

的所有新闻列表，它工作正常：

< iron-ajax auto url="localhost/api/news/news" handle-as="json" last-response="{{newsList}}"> < /iron-ajax> < template is="dom-repeat" items="{{newsList}}"> < a href="https://www.songbingjia.com/news/[[item.id]]"> [[item.title]]< /a> < /template>

我有一个其他元素用于查看单个新闻内容，名为

<
my-news-view>

，我想在

<
my-news-list>

点击每个新闻的标题时加载它。在点击路径上更改为：localhost：8081：/ news / 2正确但

<
my-news-list>

元素再次加载而不是

<
my-news-view>

。
我不粘贴其他元素代码（绑定，...）。
现在我想知道如何配置

<
app-route>

并使用子路由在这个路径中有加载元素：

// For News /news//all news list. loads my-news-list element /news/12//news[12] view. loads my-news-view elemnt /news/categories//all categories list view. loads my-news-categories element /news/categories/3//category[3] news list view. loads my-news-category element// and jobs similar to module /Jobs /jobs/country/cityName /jobs/country/cityName/featured

谢谢你的帮助。
答案您应该像“铁页”一样在“铁页”中声明“my-news-view”组件：

< iron-pages selected="[[page]]" attr-for-selected="name" fallback-selection="view404" role="main"> < my-news-view name="news-view" route="{{subroute}}" /> < /iron-pages>

因此，当用户根据名称属性而不是组件名称本身导航到/ news-view / 12时，铁页面将知道要显示的组件。
但。您的解决方案中有一些棘手的部分：

请注意如何将子路由传递给子组件，以将内部路由机制与其所在的实际URL路径分离。
入门套件使用延迟加载来导入组件，在该函数内部，它将前缀'my-'添加到实际路径'news-view'。这就是加载的结果组件名称变为'my-news-view'的方式。这可能会引起混淆。

你可以阅读更多关于这个polymer shop case study。
PS：我个人认为聚合物样本应用程序路由工作的方式很混淆，因为它看起来像Web服务器静态名称解析（基于组件名称，而不是组件属性'name'），但事实并非如此。
另一答案您应该在组件内添加组件，然后使用子路由来知道id
另一答案试试dna-router。它现在与Polymer 2.0项目兼容。
请按照这个答案 -https://stackoverflow.com/a/31236817/5069120
或者访问https://github.com/Saquib764/dna-router