Как получить значение параметра в компоненте Common в Angular 6

Question

У меня есть HeaderComponent, который является общим для всех страниц и появляется на каждой странице. Итак, я создал отдельный компонент для заголовка и добавил в app.component.html с помощью селектора. Я создал две дочерние страницы "Дом" и "Второй" и направил его с помощью <router-outlet> в app.component.ts

маршрут

const routes: Routes = [{
  path : "", component : HomeViewComponent
},{
  path : "second/:id/:category", component : SecondComponent
}];

Я передаю параметры ID и категории во вторых компонентах.

в HeaderComponent я хочу получить этот параметр при изменении маршрута, поэтому я сделал следующий код в header.component.ts

constructor(private router: Router, private route : ActivatedRoute) { }

  ngOnInit() {
    this.router.events.subscribe((val) => {
      // see also 
      this.route.params.subscribe(params => {
        console.log(params);
      });
    });
  }

Но я не могу получить параметры. Я получаю {} пустые параметры в консоли, к которой я прикрепил ссылку на стек.

https://stackblitz.com/edit/hardik?file=app%2Fapp.routing.module.ts

ОБНОВЛЕНИЕ: этот компонент заголовка есть на всех страницах, а не только во втором компоненте. поэтому я не могу поместить его только во второй компонент.

Answer 1

Использовать paramMap

this.router.events.subscribe((val) => {
  // see also 
    let id = this.route.snapshot.paramMap["id"]; 
    console.log(id)

});