title: Angular re-fetch data after parameter change GET request
body: <p>How to re-fetch data after parameter change from:
  oglas/1 to oglas/2 by click, so when put URL and than click ENTER everything works, but when click on oglas/2 button when oglas/1 is rendered URL changes to oglas/2 but data is from oglas/1?</p>
  
  <p>TS</p>
  
  <pre><code>import { Component, OnInit } from "@angular/core";
  import { ActivatedRoute } from "@angular/router";
  import { Post } from "../post.model";
  import { ServerService } from "../server.service";
  
  @Component({
    selector: "post",
    templateUrl: "./post.component.html",
    styleUrls: ["./post.component.css"]
  })
  export class PostComponent implements OnInit {
    post: Post[];
  
    constructor(
      private route: ActivatedRoute,
      private serverService: ServerService
    ) {}
  
    ngOnInit(): void {
      this.getPost();
    }
  
    getPost(): void {
      const id = +this.route.snapshot.paramMap.get("id");
      this.serverService.getPosts(id).subscribe(post =&gt; (this.post = post));
    }
  }
  </code></pre>
  
  <p>Service</p>
  
  <pre><code>import { HttpClient } from "@angular/common/http";
  import { Injectable } from "@angular/core";
  import { Post } from "./post.model";
  import { User } from "./user.model";
  import { Observable } from "rxjs";
  
  @Injectable({ providedIn: "root" })
  export class ServerService {
    usersUrl = "http://localhost:3000/users";
    postsUrl = "http://localhost:3000/posts";
  
    constructor(private http: HttpClient) {}
  
    getPosts(id: number | string): Observable&lt;Post[]&gt; {
      const url = `${this.postsUrl}/${id}`;
      return this.http.get&lt;Post[]&gt;(url);
    }
  
    getUser(id: number | string): Observable&lt;User[]&gt; {
      const url = `${this.usersUrl}/${id}`;
      return this.http.get&lt;User[]&gt;(url);
    }
  }
  
  </code></pre>