Angular2 rc1 router navigate by url

Question

I have parent component with url /app when I enter enter into that component, by default following component is loaded with following routes:

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

and I am implementing OnInit interface:

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

Since parent route is /app and child is implementing ngOnInit I can navigate to users, but if I want directly to navigate through url to route /other it is impossible.

Answer 1

There are two methods availabel for the same

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

if your going to use first one than you can use like this

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

which accepts array with route name

and in second case you have to pass string as parameter like this

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

passing parameter

if you want to send routing parameter along with routing than you can use like this

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

where id is your data/key whatever

see also

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

Answer 2

You need to declare your @Route params:

@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]);
  }
}

If you need to access your params, you can use RouteSegment in your constructor:

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

Answer 3

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

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