[英]Multiple route names for the same page in Angular 2
Is it possible to have multiple route names for a page depending on how the user arrived at the page, but keeping the same RouteConfig path? 是否可以为页面设置多个路径名称,具体取决于用户到达页面的方式,但保留相同的RouteConfig路径?
eg 例如
@RouteConfig([
{
path: 'sweet/:id',
name: 'SweetDetailLandingPage',
component: SweetDetailComponent,
data: { fromLink: false, fromDeepLink: true }
},
{
path: 'sweet/:id',
name: 'SweetDetailFromLink',
component: SweetDetailComponent,
data: { fromLink: true, fromDeepLink: false }
}
])
For example, if the user enters the URL into the browser, I want the app to load SweetDetailLandingPage
. 例如,如果用户将URL输入浏览器,我希望该应用程序加载
SweetDetailLandingPage
。 If the user arrives at the page internally via navigate(['SweetDetailFromLink'])
, I want to load SweetDetailFromLink
. 如果用户通过
navigate(['SweetDetailFromLink'])
在内部到达页面,我想加载SweetDetailFromLink
。
The reason is because I want to determine whether the user arrived via a deep link or not and be able to call certain functions on load. 原因是因为我想确定用户是否通过深层链接到达并且能够在加载时调用某些功能。
I tried this code but the app throws an error saying that there is a conflict. 我尝试了这个代码,但应用程序抛出一个错误,说有冲突。
ORIGINAL EXCEPTION: Configuration 'sweet/:id' conflicts with existing route 'sweet/:id'
I understand why there is a conflict. 我明白为什么会有冲突。 I'm just wondering if there is a way to implement what I explained above.
我只是想知道是否有办法实现我上面解释的内容。
I would use a different approach. 我会用另一种方法。 Read
window.location.href
either outside or (if it works inside Angular in the constructor of the root component) and if you get a deep link then redirect from there. 在外部读取
window.location.href
或者(如果它在根组件的构造函数中的Angular内部工作),如果你得到一个深层链接,那么从那里重定向。
There is only one time during the application lifecycle whre a deep link can be loaded, this is when the application is loaded. 在应用程序生命周期中只有一次可以加载深层链接,这是在加载应用程序时。 Afterwards an URL change always results in a page reload.
之后,URL更改始终会导致页面重新加载。 The only way to reach deep links afterwards is by the code of your Angular application (
routerLink
or router.navigateXxx()
except you are using HashLocationStrategy
instead of the default `PathLocationStrategy . 之后到达深层链接的唯一方法是使用Angular应用程序的代码(
routerLink
或router.navigateXxx()
除了您使用的是HashLocationStrategy
而不是默认的`PathLocationStrategy 。
What I would do in that case is: in the routerLinks add a query string parameter this._router.navigate(['SweetDetailLandingPage', {fromDeepLink: 'true'}]);
在这种情况下我会做的是:在routerLinks中添加一个查询字符串参数
this._router.navigate(['SweetDetailLandingPage', {fromDeepLink: 'true'}]);
and then in the load method where you want to deside to do something if you came from a deep link or not ask for that parameter: 然后在加载方法中,如果你来自深层链接或者不要求该参数,你想要做某事:
if (this.getParameterByName('fromDeepLink') === 'true'){
//do something
}else{
//do something different
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.