Javascript Angular 2 router.navigate
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38131293/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular 2 router.navigate
提问by SpaceBeers
I'm trying to navigate to a route in Angular 2 with a mix of route and query parameters.
我正在尝试使用路由和查询参数的组合导航到 Angular 2 中的路由。
Here is an example route where the route is the last part of the path:
这是一个示例路线，其中路线是路径的最后一部分：
{ path: ':foo/:bar/:baz/page', component: AComponent }
Attempting to link using the array like so:
尝试使用数组进行链接，如下所示：
this.router.navigate(['foo-content', 'bar-contents', 'baz-content', 'page'], this.params.queryParams)
I'm not getting any errors and from what I can understand this should work.
我没有收到任何错误，据我所知，这应该可行。
The Angular 2 docs (at the moment) have the following as an example:
Angular 2 文档（目前）具有以下示例：
{ path: 'hero/:id', component: HeroDetailComponent }
['/hero', hero.id] // { 15 }
Can anyone see where I'm going wrong? I'm on router 3.
谁能看到我哪里出错了？我在路由器 3 上。
回答by Günter Z?chbauer
If the first segment doesn't start with /it is a relative route. router.navigateneeds a relativeToparameter for relative navigation
如果第一段不以/它开始，则是相对路线。router.navigate需要一个relativeTo参数来进行相对导航
Either you make the route absolute:
要么让路线绝对：
this.router.navigate(['/foo-content', 'bar-contents', 'baz-content', 'page'], this.params.queryParams)
or you pass relativeTo
或者你通过 relativeTo
this.router.navigate(['../foo-content', 'bar-contents', 'baz-content', 'page'], {queryParams: this.params.queryParams, relativeTo: this.currentActivatedRoute})
See also
也可以看看
回答by yala ramesh
import { ActivatedRoute } from '@angular/router';
export class ClassName {
private router = ActivatedRoute;
constructor(r: ActivatedRoute) {
this.router =r;
}
onSuccess() {
this.router.navigate(['/user_invitation'],
{queryParams: {email: loginEmail, code: userCode}});
}
}
Get this values:
---------------
ngOnInit() {
this.route
.queryParams
.subscribe(params => {
let code = params['code'];
let userEmail = params['email'];
});
}Ref: https://angular.io/docs/ts/latest/api/router/index/NavigationExtras-interface.html
参考：https: //angular.io/docs/ts/latest/api/router/index/NavigationExtras-interface.html
