angular-crumbs
Version:
A route-based Angular breadcrumb component and service. Allows breadcrumb descriptions to be set based on route data, or as the result of an API call.
1 lines • 3.2 kB
JavaScript
!function(r,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@angular/router")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","@angular/router"],e):e((r.ng=r.ng||{},r.ng["angular-crumbs"]=r.ng["angular-crumbs"]||{}),r.ng.core,r.ng.common,r.ng.router)}(this,function(r,t,e,i){"use strict";var n=function(){},o=function(){function r(r){var e=this;this.router=r,this.breadcrumbChanged=new t.EventEmitter(!1),this.breadcrumbs=new Array,this.router.events.subscribe(function(r){e.onRouteEvent(r)})}return r.prototype.changeBreadcrumb=function(r,e){var t=this.createRootUrl(r),n=this.breadcrumbs.find(function(r){return r.url===t});n&&(n.displayName=e,this.breadcrumbChanged.emit(this.breadcrumbs))},r.prototype.onRouteEvent=function(r){if(r instanceof i.NavigationEnd){for(var e=this.router.routerState.root.snapshot,t="",n=0,o=[];null!=e.firstChild;)if(null!==(e=e.firstChild).routeConfig&&e.routeConfig.path&&(t+="/"+this.createUrl(e),e.data.breadcrumb)){var a=this.createBreadcrumb(e,t);if(n<this.breadcrumbs.length){var u=this.breadcrumbs[n++];u&&u.route==e.routeConfig&&(a.displayName=u.displayName)}o.push(a)}this.breadcrumbs=o,this.breadcrumbChanged.emit(this.breadcrumbs)}},r.prototype.createBreadcrumb=function(r,e){return{displayName:r.data.breadcrumb,terminal:this.isTerminal(r),url:e,route:r.routeConfig}},r.prototype.isTerminal=function(r){return null===r.firstChild||null===r.firstChild.routeConfig||!r.firstChild.routeConfig.path},r.prototype.createUrl=function(r){return r.url.map(function(r){return r.toString()}).join("/")},r.prototype.createRootUrl=function(r){for(var e="",t=r.root;null!==t.firstChild&&(null===(t=t.firstChild).routeConfig||!t.routeConfig.path||(e+="/"+this.createUrl(t),t!==r)););return e},r.decorators=[{type:t.Injectable}],r.ctorParameters=function(){return[{type:i.Router}]},r}(),a=function(){function r(r){var e=this;(this.breadcrumbService=r).breadcrumbChanged.subscribe(function(r){e.onBreadcrumbChange(r)})}return r.prototype.onBreadcrumbChange=function(r){this.breadcrumbs=r},r.decorators=[{type:t.Component,args:[{selector:"breadcrumb",template:'<div #template>\n <ng-content></ng-content>\n</div>\n<div class="container" *ngIf="template.children.length == 0">\n <div class="nav-wrapper">\n <div class="breadcrumb" *ngFor="let route of breadcrumbs" [ngClass]="{\'last\': route.terminal}">\n \x3c!-- disable link of last item --\x3e\n <a href="" *ngIf="!route.terminal" [routerLink]="[route.url]">{{ route.displayName }}</a>\n <span *ngIf="route.terminal">{{ route.displayName }}</span>\n </div>\n </div>\n</div>'}]}],r.ctorParameters=function(){return[{type:o}]},r}();function u(r){return new o(r)}var c=function(){function r(){}return r.decorators=[{type:t.NgModule,args:[{imports:[e.CommonModule,i.RouterModule],providers:[{provide:o,useFactory:u,deps:[i.Router]}],declarations:[a],exports:[a]}]}],r.ctorParameters=function(){return[]},r}();r.Breadcrumb=n,r.BreadcrumbModule=c,r.BreadcrumbService=o,r.BreadcrumbComponent=a,Object.defineProperty(r,"__esModule",{value:!0})});