Как установить динамический c заголовок для одиночного angular компонента

Question

В моем приложении angular у меня есть один динамический c маршрут. В этом маршруте Dynami c я передаю параметры Dynami c этому маршруту. Проблема заключается в том, что я хочу установить заголовок Dynami c для этого маршрута. как я могу передать динамический c заголовок для этого единственного маршрута

app.routing.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './pages/home/home.component';
import { SingleMoviePageComponent } from './pages/single-movie-page/single-movie-page.component';
import { MoviesComponent } from './pages/movies/movies.component';


const routes: Routes = [
  { path: '', redirectTo: '/movies', pathMatch: 'full', data: { title: 'Home Page' }},
  { path: 'movies', component: MoviesComponent, data: {title: 'All Movies Page'}},
  { path: 'movie/:id', component: SingleMoviePageComponent },
  { path: '**', redirectTo: '/'},
];

@NgModule({
  imports: [
    RouterModule.forRoot(routes, {
      scrollPositionRestoration: 'top',
    })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Я установил stati c заголовок для другого компоненты, использующие этот подход

Это мой: app.component.ts

import {Component, OnInit, ViewChild} from '@angular/core';
import {
  ActivatedRoute,
  NavigationEnd,
  Router
} from '@angular/router';
import {NgProgress} from 'ngx-progressbar';
import * as AOS from 'aos';
import {Title} from '@angular/platform-browser';
import {filter} from 'rxjs/operators';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
  title = 'Movies';

  constructor(private router: Router,
              private activatedRoute: ActivatedRoute,
              private titleService: Title,
              ){
  }

  ngOnInit(): void {
    AOS.init({});

    this.router.events.pipe(
      filter(event => event instanceof NavigationEnd),
    ).subscribe(() => {

      const getChildRoute = this.getChild(this.activatedRoute);

      getChildRoute.data.subscribe(data => {
        console.log(data);
        this.titleService.setTitle(data.title);
      });

    });

  }

  hasRoute(route: string){
    return this.router.url.includes(route);
  }

  getChild(activatedRoute: ActivatedRoute) {
    if (activatedRoute.firstChild) {
      return this.getChild(activatedRoute.firstChild);
    } else {
      return activatedRoute;
    }
  }

}

Я хочу установить динамический c заголовок для SingleMoviePageComponent согласно запрошенному movie_id из activeRoute.

Как это сделать?

Я застрял здесь.