feat(共享组件): 新增Breadcrumb模块，及Breadcrumb组件

src/app/shared/breadcrumb/breadcrumb.component.html

@@ -0,0 +1,8 @@
+<ol class="sim-breadcrumbs" fxLayout="row">
+    <li *ngFor="let url of urls; let last = last; let first = first" [ngClass]="{'active': last}" fxLayout="row" fxLayoutAlign="center center">
+        <a role="button" *ngIf="!last && url == prefix">{{url}}</a>
+        <a role="button" *ngIf="!last && url != prefix">{{friendlyName(url)}}</a>
+        <span *ngIf="last">{{friendlyName(url)}}</span>
+        <span *ngIf="last && url == prefix">{{friendlyName('/')}}</span>
+    </li>
+</ol>

src/app/shared/breadcrumb/breadcrumb.component.scss

@@ -0,0 +1,10 @@
+.sim-breadcrumbs {
+    margin: 0;
+    padding: 0 16px;
+    list-style: none;
+    font-weight: 400;
+    font-size: 20px;
+    li {
+        line-height: 64px;
+    }
+}

src/app/shared/breadcrumb/breadcrumb.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BreadcrumbComponent } from './breadcrumb.component';
+
+describe('BreadcrumbComponent', () => {
+  let component: BreadcrumbComponent;
+  let fixture: ComponentFixture<BreadcrumbComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ BreadcrumbComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BreadcrumbComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/shared/breadcrumb/breadcrumb.component.ts

@@ -0,0 +1,41 @@
+import { Component, OnInit, Inject } from '@angular/core';
+import { Router, NavigationEnd } from '@angular/router';
+import { INav } from '../nav';
+import { Subscription } from 'rxjs/Subscription';
+@Component({
+  selector: 'sim-breadcrumb',
+  templateUrl: './breadcrumb.component.html',
+  styleUrls: ['./breadcrumb.component.scss']
+})
+export class BreadcrumbComponent implements OnInit {
+  _breadcrumbs: Array<INav> = [];
+  private _routerSubscription: Subscription;
+  constructor(private _router: Router, @Inject('BREADCRUMB_CONFIG') private _nav) { }
+
+  ngOnInit() {
+    // console.log(this.getFriendlyNameForRoute(this._router.url), this._nav[0].children)
+    this._breadcrumbs.push(this._nav[0]);
+    this._routerSubscription = this._router.events.subscribe((navigationEnd: NavigationEnd) => {
+      console.log('navigationEnd.urlAfterRedirects', navigationEnd.urlAfterRedirects, navigationEnd.url)
+      /*  this.urls.length = 0; //Fastest way to clear out array
+       this.generateBreadcrumbTrail(navigationEnd.urlAfterRedirects ? navigationEnd.urlAfterRedirects : navigationEnd.url); */
+    });
+  }
+
+  ngOnDestroy(): void {
+    this._routerSubscription.unsubscribe();
+  }
+
+
+  getFriendlyNameForRoute(route: string): string[] {
+    return route.split('/');
+  }
+
+  /*   getFriendlyPath(nav: INav): INav {
+      if (!nav.children) {
+        return;
+      }
+      return this.getFriendlyPath(nav: INav);
+    } */
+
+}

src/app/shared/breadcrumb/breadcrumb.module.ts

@@ -0,0 +1,21 @@
+import { NgModule, ModuleWithProviders } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { BreadcrumbComponent } from './breadcrumb.component';
+import { INav } from '../nav';
+@NgModule({
+  imports: [
+    CommonModule
+  ],
+  declarations: [BreadcrumbComponent],
+  exports: [BreadcrumbComponent]
+})
+export class BreadcrumbModule {
+  static forRoot(config: any = []): ModuleWithProviders {
+    return {
+      ngModule: BreadcrumbModule,
+      providers: [
+        { provide: 'BREADCRUMB_CONFIG', useValue: config }
+      ]
+    };
+  }
+}

src/app/shared/breadcrumb/index.ts

@@ -0,0 +1 @@
+export * from './breadcrumb.module';