Angular 6 routerLinkActive with params workaround

app-routing-module.ts

import {NgModule} from '@angular/core';
import {RouterModule, Routes} from '@angular/router';
import {DashboardViewRouteComponent} from '@routes/dashboard-view-route/dashboard-view-route.component';
import {ProjectsViewRouteComponent} from '@routes/projects-view-route/projects-view-route.component';
import {ProjectsViewDetailsRouteComponent} from '@routes/projects-view-details-route/projects-view-details-route.component';
import {ProjectsAddViewRouteComponent} from '@routes/projects-add-view-route/projects-add-view-route.component';
import {ProjectsViewDetailsTableComponent} from '@routes/projects-view-details-table/projects-view-details-table.component';

const routes: Routes = [
  {path: '', redirectTo: 'dashboard', pathMatch: 'full'},
  {path: 'dashboard', component: DashboardViewRouteComponent},
  {path: 'projects', component: ProjectsViewRouteComponent},
  {
    path: 'projects/:configGroupId/:domainGroup',
    component: ProjectsViewDetailsRouteComponent,
    children: [{
        path: '',
        component: ProjectsViewDetailsTableComponent
    }, {
        path: 'add',
        component: ProjectsAddViewRouteComponent
      }]
  }
];

@NgModule({
  exports: [RouterModule],
  imports: [RouterModule.forRoot(routes, {useHash: true})],
})

export class AppRoutingModule {
}

projects-view-details-route.component.html

<div class="container-fluid detail-view">
  <nav mat-tab-nav-bar class="mb-4">
    <a mat-tab-link
       *ngFor="let link of navLinks"
       [routerLink]="link.path"
       routerLinkActive #rla="routerLinkActive"
       [routerLinkActiveOptions]="{exact: false}"
       [active]="link.path === currentPath">
      {{link.label}}
    </a>
  </nav>
  <router-outlet></router-outlet>
</div>

projects-view-details-route.component.ts

// compare the current url with the parent url
import {Component, OnInit} from '@angular/core';
import {ActivatedRoute, Router, NavigationEnd} from '@angular/router';

@Component({
  selector: 'app-projects-view-details-route',
  templateUrl: './projects-view-details-route.component.html',
  styleUrls: ['./projects-view-details-route.component.scss']
})
export class ProjectsViewDetailsRouteComponent implements OnInit {
  path = '/' + this.route.snapshot.url.map(o => o.path).join('/');
  currentPath: any;
  navLinks: any[] = [];
  constructor(
    private route: ActivatedRoute,
    private router: Router
  ) {
    this.router.events.subscribe((event) => {
      if (event instanceof NavigationEnd) {
        const url = event.url.split('?');
        this.currentPath = decodeURIComponent(url[0]);
      }
    });
  }

  ngOnInit() {
    this.navLinks = [{
      path: this.path,
      label: 'Banners'
    }, {
      path: this.path + '/add',
      label: 'Add New'
    }];
  }

}