How to add call back for multiple parameters?

[GlennVanSchil]

I Have the following routes

/projects/
/projects/:projectId
/projects/:projectId/fields
/projects/:projectId/fields/:fieldId

I've successfully replaced the projectId with a project name in the breadcrumb

Projects / Project Name
Projects / Project Name / Fields
Projects / Project Name / Fields / Field ID

by doing

import {Component, OnInit, ViewEncapsulation} from '@angular/core';
import {BreadcrumbService} from 'ng2-breadcrumb/bundles/components/breadcrumbService';

@Component({
  selector: 'app-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.css'],
  encapsulation: ViewEncapsulation.None,
})
export class DashboardComponent implements OnInit {

  /**
   * Regex for UUID: [0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}
   * @param {BreadcrumbService} breadcrumbService
   */
  constructor(private breadcrumbService: BreadcrumbService) {
    breadcrumbService.addFriendlyNameForRoute('/projects', 'Projects');
    breadcrumbService.addCallbackForRouteRegex('^/projects/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$', this.getNameForProject);
    breadcrumbService.addFriendlyNameForRouteRegex('^/projects/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/fields', 'Fields');
  }

  ngOnInit() {
  }

  getNameForProject(projectId: string): string {
    console.log('getNameForProject', projectId);
    return 'Project Name';
  }

}

But I'm unable to replace the fieldId as well. My goal is to create a breadcrumb like this:

Project / Project Name / Fields / Field Name

Do you have any documentation about this?