Есть ли способ обработки нескольких видов с одним угловым компонентом?

Question

Я разрабатываю веб-сайт для управления информацией в виде информационных панелей.У каждой панели инструментов будет URL / панель инструментов / что-то1 / что-то2, / панель инструментов / что-то3 / что-то4.Я пытался найти решение для динамической обработки каждого URL-адреса, вызывая API на основе URL-адреса и отображая данные в одном и том же компоненте, но, похоже, ни один из них не работает должным образом.

Я пробовал ActivatedRoute, но япрочитайте это, так как это что-то вне <router-outlet>, он, вероятно, вернет пустой URL.Я также пытался activatedRoute.snapshot['_routerState'].url, но я не думаю, что это правильный способ справиться с этим.Я также пытаюсь использовать только router.url

import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';

@Component({
  selector: 'ngx-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.scss'],
})
export class DashboardComponent implements OnInit {
  data: string;

  constructor(private router: Router) {
    this.router.events.subscribe(e => {
      if (e instanceof NavigationEnd) {
        this.url = this.router.url;

        //then use the url params to call APIs and fill in data
      }
    });
  }

  ngOnInit() {}
}

Как правильно получить URL каждого маршрута, и есть ли какое-либо другое решение для меня, чтобы вообще обрабатывать разные представления в одном и том же компоненте динамически