如何在 angular2 中通过 Router.navigate 传递 RouteData

Question

Is there an api in agnular2 that allows passing json objects instead of string values . Eg In Router.navigate() I can pass route parameters

Router.navigate('routename',[{key:stringvalue}])

and can retrieve it using RouteParams.get(key) : string . But this returns just string values. I need to pass the json object.

Appreciate any pointers

Answer 1

Another Solution that works is using the params Property of RouterParams. This may not be the preferred way, but it works (as of Beta8).

if you navigate with Router.navigate(['/myRoute',{someProperty:"SomeValue"}] you can access the param with:

constructor(routeParams: RouteParams){
  let myPassedData: any = routeParams.params;
  console.log(myPassedData.someProperty); #Prints "SomeValue"
}

Answer 2

I think that it's not something possible out of the box since routing relies on URLs and both path variables and query parameters are strings. Both RouterParams and RouterData only supports string attributes.

To simulate this, I don't see other solutions than encoding your JSON objects using JSON.stringify and parsing them on the other side.

Here is a plunkr describing this: https://plnkr.co/edit/jbl7v5fHQEmf4F8tpXDO?p=preview .

Hope it helps you, Thierry

Answer 3

For Angualr 7,8+:

sending end:

this.router.navigate(['/targeturl/' , JSON.stringify(inputParameter)]);

receiveing end:

import {  ActivatedRoute,  Router} ....

 sub;
  ngOnInit() {

this.sub = this.activatedroute.paramMap.subscribe(params => {
  console.log(params);
  debugger;
  }); }