如何在Angular 4中实现面包屑导航？附现有路由代码

我目前在做Angular 4项目，想要实现一个结构为主页 > 解决方案 > 结果 > 联系我们的面包屑导航。现在我的路由配置代码是这样的：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { SolutionsComponent } from "./solutions.component";
import { ResultComponent } from "./result/result.component";
import { ContactComponent } from './contact/contact.component';

const routes: Routes = [
  { path: 'home/solutions', component: SolutionsComponent },
  { path: 'home/solutions/result', component:ResultComponent },
  { path: 'home/solutions/result/contact', component: ContactComponent }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

我自己已经搭建了一个部分可用的Plunker，但还没完全实现想要的面包屑效果，有没有大佬能提供一个完整的实现示例呀？

感谢！

内容的提问来源于stack exchange，提问作者Angular