Angular 4 Router:如何不在网址栏中显示参数? [英] Angular 4 Router: How to not display parameters in the url bar?

问题描述

当我使用时:

  constructor(router: Router) {
    router.navigate(['page2', 123456789]);
  }

我在地址栏中看到了example.com/page2/123456789.是否可以隐藏它?我不不希望某人能够输入example.com/page2，以便他/她导航到此特殊页面.它只能在内部使用命令router.navigate(['xy', 'parameter']);

I see example.com/page2/123456789 in the address bar. Is it possible to hide it? I don't want someone to be able to enter example.com/page2 so that he/she navigates to this special page. It should only work internally with the command router.navigate(['xy', 'parameter']);

推荐答案

使用angularJS或angularjs 1.x中的状态路由，可以在路由过程中用动态数据隐藏参数，但是Angular 2+路由不允许.

The param hiding with dynamic data during routing was possible with state routing in angularJS or angularjs 1.x but Angular 2+ routing doesn't allow.

唯一的解决方案是使用服务，否则请阅读下文.

The only solution would be to use service else read below.

参数不是要隐藏的，而data属性是要隐藏的.因此，不要使用SkipLocationChange:true应该使用data属性.注意data属性不能用于动态内容.它将是更多的静态数据.

param are not meant to be hidden but data property is. So instead of using SkipLocationChange: true one should use data property. Note data property cannot be used for dynamic content. It will be more of static data.

SkipLocationChange:true导航而不将新状态推入历史记录.这意味着，如果您要从/page1导航到/page2，则导航后url仍将显示/page1.这不是作者所期望的.这里的期望是在URL中显示/page2，但在URL中看不到参数.

SkipLocationChange: true Navigates without pushing a new state into history. This mean if you are navigating from /page1 to /page2 then url will still show /page1 after navigation. This is not what author is expecting. here the expectation is to show /page2 in url but without param visible in url.

解决方案是在路由配置中使用数据属性 例如

The solution is to use data property in route config for example

 path: 'product', component: ProductComponent , data: [{isProd: true}]}

然后您可以获取数据值，如下所示

then you can get the value of the data as show below

 route.snapshot.data[0]['isProd'];

这篇关于Angular 4 Router:如何不在网址栏中显示参数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！