parammap - Los datos de Angular ActivatedRoute devuelven un objeto vacío

import activatedroute from ''@ angular router '';

Question

Tengo una ruta registrada con algunos datos:

const routes: Routes =
[
{path: ''my-route'', data: { title: ''MyTitle'' }, component: MyComponent},
];

y estoy tratando de acceder a los datos de la ruta usando ActivatedRoute :

import { Component, OnInit } from ''@angular/core'';
import { ActivatedRoute } from ''@angular/router'';
@Component({...})
export class MyComponent implements OnInit {
constructor(private route: ActivatedRoute) {}
public ngOnInit() {
this.routeData = this.route.data.subscribe((data) => {
console.log(data); // this is returning an empty object {}
});
}
}

pero por alguna razón los data son un objeto vacío.

¿Cómo resolver este problema?

Answer 1

Edición: el problema es que estaba intentando acceder a ActivatedRoute desde un componente que está fuera de <router-outlet> . Así que parece que este es el comportamiento previsto.

Sin embargo, sigo pensando que mi respuesta a continuación puede ser útil para cualquier persona que esté tratando de lograr lo mismo.

Encontré una solución alternativa en GitHub (gracias manklu ) que usé para lograr lo que necesitaba:

import { Component, OnInit } from ''@angular/core'';
import { Router, RoutesRecognized } from ''@angular/router'';
@Component({...})
export class MyComponent implements OnInit {
private routeData;
constructor(private router: Router) { }
ngOnInit() {
this.router.events.subscribe((data) => {
if (data instanceof RoutesRecognized) {
this.routeData = data.state.root.firstChild.data;
}
});
}
}

de esta manera this.routeData mantendrá los datos de ruta que necesitaba (en mi caso, el title la página).

Answer 2

A continuación debe trabajar:

constructor(private route: ActivatedRoute) {}
ngOnInit() {
console.log(this.route.snapshot.data);
}

Answer 3

No sé la versión hablada, pero a partir de Angular 6 , esto funcionó para mí:

(Por supuesto gracias a ShinDath)

 routeData;
ngOnInit() {
//child route param doesnt go up to parent route params.
this.router.events.subscribe((val) => {
if (val instanceof ActivationEnd) {
if(!$.isEmptyObject(val.snapshot.params)){
this.routeData = val.snapshot.params;
}
}
});
}