angular - Å sende et objekt som parameter i ruten returnerer [Object object]


Dette er i min routing.module:

{path: 'hero' component: HeroComponent}

Og slik sender jeg objektet gjennom ruten:

this.router.createUrlTree(['/hero', {my_object: this.Obj}]));
window.open(url, '_blank');

I min hero-komponent leser jeg objektet slik:

this.route.snapshot.paramMap.get('my_object');

console.log(this.route.snapshot.paramMap.get('my_object');) returnerer:

[Object object]

og å lese en egenskap til et objekt, for eksempel .id, returnerer:

undefined

Hvis jeg prøver å iterere den med *ngFor, får jeg:

ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'string'. NgFor only supports binding to Iterables such as Arrays.

Hvorfor skjer dette?

Svar #1

Forsøk å sende en streng ved å bruke JSON.stringify()

this.router.createUrlTree(['/hero', {my_object: JSON.stringify(this.Obj)}]));

og parse det tilbake i mottakeren

this.Obj = JSON.parse(this.route.snapshot.paramMap.get('my_object'));

Og hvis Obj-variabelen er et objekt, må du bruke keyvalue-pipe for å iterere over det ved å bruke *ngFor-direktiv

<ng-container *ngFor="let item of Obj | keyvalue">
  {{ item.key }}: {{ item.value }}
</ng-container>

Relaterte artikler