Angular - найти имя дочернего компонента

у меня есть родительский компонент с компонентом хлебных крошек и роутером:

<div class = "LG_popage-wrap">
  <div class = "LG_global-popage-crumbs" style = "text-align: center">
    <app-breadcrumb [breadcrumbsData] = "breadcrumb" ></app-breadcrumb>
  </div>
  <router-outlet></router-outlet>
</div>

Атрибуты хлебных крошек - это просто массив имени компонента:

  breadcrumb: Array<BreadcrumbModel> = [
    {
      componentName: 'StepSetupComponent',
      label: 'setup'
    },
    {
      componentName: 'StepFieldsComponent',
      label: 'fields'
    },
  ]

Мне нужно в моем дочернем маршруте (введенном с помощью маршрутизатора Outlet) сравнить имя текущего имени компонента с моим массивом. Я уже кодирую это, но его работа только в локальной среде, а не в производстве

export class BreadcrumbComponent implements OnInit {

  @Input() breadcrumbsData: Array<BreadcrumbModel> = [];
  breadcrumbsIndex: number;
  constructor(
    private route: ActivatedRoute,
    private router: Router
  ) {
    router.events.subscribe((val) => {
      // Route changing
      window.scrollTo(0, 0);

      this.breadcrumbsIndex = this.breadcrumbsData.findIndex(x => x.componentName === this.route.firstChild.component['name']);
    });
  }

  ngOnInit() {
    this.breadcrumbsIndex = this.breadcrumbsData.findIndex(x => x.componentName === this.route.firstChild.component['name']);
  }

}

Проблема заключается в следующем: this.route.firstChild.component ['name']

На местном языке он дает мне название компонента. Но в продукте он дает мне имя "N"

как я могу найти имя моего текущего компонента?

спасибо за вашу помощь.