Angular2 rc1路由器通过URL导航

Question

当我进入该组件时，我的父组件带有url / app，默认情况下，以下组件加载了以下路由：

@Routes([
   { path: '/users', component: UserComponent },
   { path: '/other', component: OtherComponent }
])

我正在实现OnInit接口：

ngOnInit() {
    this.router.navigate(['users'], this.currSegment);
}

由于父级路由是/ app，子级正在实现ngOnInit，因此我可以导航到用户，但是如果我想直接在URL中导航以路由/ other，则不可能。

Answer 1

相同的方法有两种

• router.navigate(['.....'])
• router.navigateByUrl('.....')

如果您要使用第一个，则可以像这样使用

this.router.navigate(['/users']);

接受带有路由名称的数组

在第二种情况下，您必须像这样传递字符串作为参数

this.router.navigateByUrl('/app/users');

传递参数

如果要与路由一起发送路由参数，则可以像这样使用

this.router.navigateByUrl（'/ app / users /'+ id）;

id是您的数据/密钥，无论

也可以看看

• https://angular.io/docs/ts/latest/api/router/index/Router-class.html#!#navigateByUrl-anchor

Answer 2

您需要声明@Route参数：

@Route([
  { path: '/users/:id', component: UsersComponent }
])
export class MyComponent implements OnInit {
  constructor(private router: Router) {}
  ngOnInit() {
    // assuming this.userId comes from somewhere
    this.router.navigate(['/users/', this.userId]);
  }
}

如果需要访问参数，则可以在构造函数中使用RouteSegment ：

constructor(private segment: RouteSegment) {
  this.userId = segment.getParam('id');
}

Answer 3

在angular2 rc1中，不再有用于路由的name参数，您现在必须使用以下代码导航到其他页面

this._router.navigate(['/users']);