Не работает маршрутизация Angular

import { Component, OnInit } from '@angular/core';
import {ActivatedRoute} from "@angular/router";
import {PostService} from "../services/post.service";
import {IPost} from "../models/post";
 
@Component({
  selector: 'app-posts-details',
  templateUrl: './posts-details.component.html',
  styleUrls: ['./posts-details.component.css']
})
export class PostsDetailsComponent implements OnInit {
 
  fullPost: IPost[];
 
  constructor(private activatedRoute: ActivatedRoute, private postsService: PostService) {
    this.activatedRoute.params.subscribe(params => {
      this.postsService.getPost(params['id']).subscribe(value => this.fullPost = value)
    })
  }
 
  ngOnInit(): void {}
 
}

import { Injectable } from '@angular/core';
import {HttpClient} from "@angular/common/http";
import {Observable} from "rxjs";
import {IPost} from "../models/post";
 
@Injectable({
  providedIn: 'root'
})
export class PostService {
 
  private url = `https://jsonplaceholder.typicode.com/posts`
 
  constructor(private httpCLient: HttpClient) { }
 
  getPosts(): Observable<IPost[]> {
    return this.httpCLient.get<IPost[]>(this.url)
  }
 
  getPost(id: string): Observable<IPost[]> {
    return this.httpCLient.get<IPost[]>(this.url + '/' + id)
  }
 
}

<div *ngFor="let post of fullPost">
  {{post.id}}
  {{post.title}}
</div>