Question

我正在使用聚合物启动套件，并尝试访问不必在页面上链接到用户的路径。

routing.html：

page('/users/:name', function(data) {
  app.route = 'user-info';
  app.params = data.params;
});

在页面上我有：

<a href$="{{baseUrl}}users/Addy">Addy</a><br>
<a href$="{{baseUrl}}users/Rob">Rob</a><br>
<a href$="{{baseUrl}}users/Chuck">Chuck</a><br>
<a href$="{{baseUrl}}users/Sam">Sam</a>

它匹配指定网址正确的4个用户，但我希望路由匹配任何名称，即使没有链接到页面。

它可以使用匹配所有内容的路径'/ users / *'，但如果我不需要，我不想使用它。

Answer 1

你拥有的那条路线将实现你想要的。 page.js使用:字符的方式是作为标识符，在此之后应该将其视为参数。假设我们有以下路线：

page('/users/:name', function(data) {
 app.route = 'user-info';
 app.params = data.params;
});

我们可以匹配以下网址：

/users/Addy
/users/Chuck
/users/somebody

路线的:name部分可以是我们想要的任何部分，它将被匹配。要知道:name部分在您的聚合物代码上是什么，您需要从我们在定义路径时指定的函数中获取它。在函数上传递的data参数包含该信息。

在我们在此处定义的路线上，我们可以在路线定义中使用:name访问data.params.name参数。

page('/users/:name', function( data ){
  //We have access to the :name parameter here
});

让想要数据的元素知道它的最佳方法。是将:name参数设置为app对象上的变量。

page('/users/:name', function( data ){
  app.route = 'user-info';
  app.params = data.params;
});

该代码将整个参数数据设置为app对象上的变量。在这种情况下，我们想要访问:name参数。我们采用的方法是将app.params对象传递给需要该数据的元素，并使用:name访问params.name参数，假设您已将该元素属性命名为whic你使用它params。

<custom-elem params="{{params}}></custom-elem>

期望该元素成为<template is="dom-bind" id="app">元素的子元素。

考虑到这一点，我们可以转到与路线匹配的任何路线/users/anything，如果您已正确设置用户页面，则会在{1}的情况下看到用户信息。 } user。

您可以在此处阅读有关使用page.js进行路由的详情：Visionmedia Page.js

要解决来自当前网站外部的问题，请使用以下代码。

anything

这不是最优雅的事情，但会解决问题。它会导致丑陋的网址有两个斜杠。

解决第二个问题的更好方法。请勿var users = function(data){ app.route = 'user-info'; app.params = data.params; }; page('/users/:name', users); page('//users/:name', users);选项将其设置为hashbangs: true。而是将基本网址设置为：false这解决了问题并从网址中删除了annoiyng page.base('/#');。：）

路由中的Polymer和page.js通配符

1 个答案: