Angulaire ngOnInit - Actualiser nécessaire

Question

J'ai une application web. Dans ma barre de droite, j'ai 3 messages. Lorsque je clique sur un poste, j'ai une navigation:

this.router.navigate(['../post', this.post.id]); 

Il un composant poste de profil prendra le relais. Ce composant a une fonction qui appelle une fonction d'un service qui obtient mon message avec l'ID spécifié. Maintenant, je vais voir tous les détails de ce poste dans ma zone de contenu (partie gauche de l'écran). Cette fonction (qui reçoit mon message) est appelée uniquement dans ngOnInit sur le composant Post Profile. Si je clique sur un autre message de ma barre latérale droite, je peux voir la modification de l'URL, mais la fonction qui reçoit mon message n'est pas appelée et les détails de publication de ma zone de contenu ne sont pas modifiés. Si je rafraîchis la page maintenant je peux voir le poste que je veux, tout fonctionne bien.

J'ai des souscriptions sur mes fonctions, si cela peut vous aider.

Je ne vois pas le problème.

Ceci est mon PostProfileComponent

 constructor(postsService: PostsService, route: ActivatedRoute) { 
    this.postsService = postsService; 

    this.routeSubscription = route.params 
     .subscribe((params: any) => { 
      this.postId = params['id']; 
     }); 
} 

public getPostById(id: any): void { 
    this.postsService.getPostById(id) 
     .map((response: Post) => { 
      this.post = response; 
      console.log(this.post); 
     }) 
     .catch((error: any) => { 
      return error; 
     }) 
     .subscribe(); 
} 

ngOnInit(): void { 
    this.getPostById(this.postId); 
} 

Answer 1

Dans votre méthode de composant Profil Envoyer un message ngOnInit que vous avez pour vous abonner à la ActivatedRouteparams Observable.

subs1: Subscription; 
    constructor(private route: ActivatedRoute){} 

    ngOnInit() { 
    this.subs1 = this.route.params 
     .subscribe((params: Params) => { 
      const postId = params['id'] ? +params['id'] : ''; 
      if(postId){ 
       // call the function (that gets the post) 
      } 
     }); 
    }