import { DOCUMENT } from '@angular/common';
import { Component, HostListener, Inject, NgZone } from '@angular/core';
import { Router } from '@angular/router';
@Component({
  selector: 'app-my-dashboards',
  templateUrl: './my-dashboards.component.html',
  styleUrls: ['./my-dashboards.component.css']
})
export class MyDashboardsComponent {
  @HostListener('click')
  breadcrumb: any;
  lawgroup: string;
  constructor(
    @Inject(DOCUMENT)
    private router: Router,
    private ngZone: NgZone
  ) {
  }
  ngOnInit() {
    this.breadcrumb = {
      'mainlabel': 'Law Groups',
      'links': [
        {
          'name': 'Home',
          'isLink': true,
          'link': '/dashboard/sales'
        },
        {
          'name': 'Law Groups Dashboard',
          'isLink': false,
          'link': '#'
        },
      ]
    };
  }
  goToLawGroupDashboard(lg: string): void {
    let fullRoute = '';
    this.lawgroup = lg;
    fullRoute = 'office/' + this.lawgroup;
    this.ngZone.run(() => {
      this.router.navigate([fullRoute]);
    });
  }
}

<a [routerLink]="['/office', 'ABC']" class="h3adjust h3adjust-link" (click)="goToLawGroupDashboard('ABC')" title="Click to go to the ABC Dashboard">BLG</a>

      {
        path: 'office/:id',
        component: OfficeComponent
      }