Angular URL 数据生成

Question

我正在寻找一种能够在进入我的网站之前根据输入的 url 生成数据的解决方案。假设我的网站有域 mywebsite.com。方法如下：

如果用户访问 mywebsite.com/A：

console.log(A)

如果用户访问 mywebsite.com/B：

console.log(B)

就是这么简单。

mywebsite.com/A mywebsite.com/B 是同一页面，如下所述。

现在，对于 Angular 上的“蛮力”解决方案，我只需制作不同的页面并让 url 路由到该页面。不过，这些新页面中的每一个都将具有完全相同的 html 布局，因为唯一可以区分它们的是一小段代码。因此，为什么这样做效率低。

显然，如果我说 10 页，这个任务变得有点低效。我不想生成 10 个具有相同 html 的页面，只是为了 console.log 在这个例子中有所不同。

实际上，我不想误导您考虑页面；我觉得这可以在 Angular 的一个组件上完成。这不是页面问题，而是数据问题：只要 url 可以在第一页上生成某种独特的数据，那么通过组件交互将这些信息带到工作流程中是微不足道的。

作为说明，我多次看到可以创建页面链接的大公司：想想 google hangouts，页面上的数据（独特的聊天室）由 url google.com/blabla123465adsfas 或某物。显然，谷歌没有成千上万的独特网页处于待命状态；如果有意义的话，它最像同一个页面。

这很难解释，也许这就是我找不到任何文档的原因。最大的问题是这是否可以在没有任何后端设置的情况下完成，这将是一个巨大的好处。

这可能是一个非常简单的解决方案。

TL;DR Angular：我可以根据访问的 url 生成受控数据，而不必为每个唯一的 url 创建新页面。 甚至更高级别：能够生成角度组件数据的唯一 url

非常感谢！

Answer 1

如果我正确理解了您的问题，我想您只需在路由模块中创建不同的路由，例如

const routes: Routes = [
{
path: 'routeA',
component: SameSampleComponent
},
{
path: 'routeB',
component: SameSampleComponent
}
];

然后在组件里面简单的添加

private router: Router

给构造函数

并调用console.log(this.router.url);获取当前路径

还有什么比向路由添加查询参数更简单的方法，例如mywebsite.com/?id=abc123，然后简单地

id: string;
 constructor(private route: ActivatedRoute) { 
 this.route.queryParams.subscribe(params => { 
this.id = params['id'];
 }); 
}