Angular Passing Data Between Routes
You can't pass list of data in params
So you need convert to string the list of objects then pass
navigate('root', JSON.stringify(data))
Then do parsing while get this
const key: Products =JSON.parse(this.dataRoute.snapshot.params['objectProducts']);
When you pass an object as a route parameter, it causes to call toString
on that object and you get the result [object Object]
from the object.
const obj = {};
console.log(obj.toString());
If you want to pass complex type, you need to stringify
it to a string
and pass as a string
. After when you get it, you need again to parse into an object.
this.route.navigate(['/requests/fill', JSON.stringify(data)]);
and access later
const key: Products = JSON.parse(this.dataRoute.snapshot.params['objectProducts']);
In the current version this is now available in @angular/router
.
Angular 7.2 introduces route state to NavigationExtras
, which takes an object literal similar to queryParams
, etc.
The state can be set imperatively:
this.router.navigate(['example'], {
state: { example: 'data' }
});
or declaratively:
<a routerLink="/example" [state]="{ example: 'data' }">
Hello World
</a>
And read in a top-level component using:
this.router.getCurrentNavigation().extras.state;
or within child components using:
window.history.state
Added a working example of it being used on StackBlitz