Dynamic Breadcrumb Navigation

I am making breadcrumb navigation with Aurelia. It will look like this: User > User Edit

I get to my User Edit page from a button on the User page. Is there a way to dynamically display on my User Edit page the page or route that I was referred from?

Thanks :slight_smile:

I do this to add anchor tag to parentRoute. This code only gives you parent url. You probably need to get title (instruction.config.title) from currentInstruction too for the anchor label.

import {inject} from 'aurelia-framework';
import {Router} from 'aurelia-router';

function _url(instruction) {
  let url = instruction.fragment;
  if (instruction.queryString) url += '?' + instruction.queryString;
  return url;
}

@inject(Router)
export class Details {
  parentRoute = null;

  // name it parentRouter to avoid conflict with your
  // local child router (if there is).
  constructor(parentRouter) {
    this.parentRouter = parentRouter;
  }

  activate(params, routeConfig) {
    if (!this.parentRoute) {
      this.parentRoute = this.parentRouter.currentInstruction ?
        _url(this.parentRouter.currentInstruction) :
        this.parentRouter.generate('fallback_route_name_in_fresh_page_load'); 
    }
  }
}