ngx-breadcrumbs
Version:
Angular 4+ routing breadcrumbs
263 lines (258 loc) • 9.85 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/router'), require('rxjs/Observable'), require('rxjs/BehaviorSubject'), require('rxjs/add/observable/of'), require('rxjs/add/operator/filter'), require('rxjs/add/operator/concat'), require('rxjs/add/operator/mergeMap'), require('rxjs/add/operator/toArray'), require('rxjs/add/operator/distinct'), require('rxjs/add/operator/first'), require('rxjs/add/observable/fromPromise'), require('lodash.template'), require('lodash.templatesettings'), require('@angular/common')) :
typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/router', 'rxjs/Observable', 'rxjs/BehaviorSubject', 'rxjs/add/observable/of', 'rxjs/add/operator/filter', 'rxjs/add/operator/concat', 'rxjs/add/operator/mergeMap', 'rxjs/add/operator/toArray', 'rxjs/add/operator/distinct', 'rxjs/add/operator/first', 'rxjs/add/observable/fromPromise', 'lodash.template', 'lodash.templatesettings', '@angular/common'], factory) :
(factory((global['ngx-breadcrumbs'] = {}),global.ng.core,global.ng.router,global.Rx,global.Rx,global.Rx.Observable,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable,global.lodash.template,global.lodash.templatesettings,global.ng.common));
}(this, (function (exports,core,router,Observable,BehaviorSubject,of,filter,concat,mergeMap,toArray,distinct,first,fromPromise,template,templateSettings,common) { 'use strict';
// Angular makes it impossible to make modules optional :(
// try {
// const _ = r('lodash');
// _template = _.template;
// _templateSettings = _.templateSetting
// } catch (e) {
// try {
// _template = r('lodash.template');
// _templateSettings = r('lodash.templatesettings');
// } catch (e) {
// _template = (y) => (x) => y;
// _templateSettings = {};
// }
// } finally {
// _templateSettings.interpolate = /{{([\s\S]+?)}}/g;
// }
var _ = {
template: template,
templateSettings: templateSettings
};
_.templateSettings.interpolate = /{{([\s\S]+?)}}/g;
/**
* @param {?} template
* @param {?} binding
* @return {?}
*/
function stringFormat(template$$1, binding) {
var /** @type {?} */ compiled = _.template(template$$1);
return compiled(binding);
}
/**
* @param {?} value
* @return {?}
*/
function isPromise(value) {
return value && (typeof value.then === 'function');
}
/**
* @template T
* @param {?} value
* @return {?}
*/
function wrapIntoObservable(value) {
if (value instanceof Observable.Observable)
return value;
if (isPromise(value)) {
return Observable.Observable.fromPromise(Promise.resolve(value));
}
return Observable.Observable.of(/** @type {?} */ (value));
}
var McBreadcrumbsConfig = (function () {
function McBreadcrumbsConfig() {
}
return McBreadcrumbsConfig;
}());
McBreadcrumbsConfig.decorators = [
{ type: core.Injectable },
];
/**
* @nocollapse
*/
McBreadcrumbsConfig.ctorParameters = function () { return []; };
var McBreadcrumbsResolver = (function () {
function McBreadcrumbsResolver() {
}
/**
* @param {?} route
* @param {?} state
* @return {?}
*/
McBreadcrumbsResolver.prototype.resolve = function (route, state) {
var /** @type {?} */ data = route.routeConfig.data;
var /** @type {?} */ path = this.getFullPath(route);
var /** @type {?} */ text = typeof (data.breadcrumbs) === 'string' ? data.breadcrumbs : data.breadcrumbs.text || data.text || path;
text = stringFormat(text, route.data);
var /** @type {?} */ crumbs = [{
text: text,
path: path
}];
return Observable.Observable.of(crumbs);
};
/**
* @param {?} route
* @return {?}
*/
McBreadcrumbsResolver.prototype.getFullPath = function (route) {
var /** @type {?} */ relativePath = function (segments) { return segments.reduce(function (a, v) { return a += '/' + v.path; }, ''); };
var /** @type {?} */ fullPath = function (routes) { return routes.reduce(function (a, v) { return a += relativePath(v.url); }, ''); };
return fullPath(route.pathFromRoot);
};
return McBreadcrumbsResolver;
}());
var McBreadcrumbsService = (function () {
/**
* @param {?} _router
* @param {?} route
* @param {?} _config
* @param {?} _injector
*/
function McBreadcrumbsService(_router, route, _config, _injector) {
var _this = this;
this._router = _router;
this._config = _config;
this._injector = _injector;
this._breadcrumbs = new BehaviorSubject.BehaviorSubject([]);
this._defaultResolver = new McBreadcrumbsResolver();
this._router.events
.filter(function (x) { return x instanceof router.NavigationEnd; })
.subscribe(function (event) {
var route = _router.routerState.snapshot.root;
//Observable.of(this._config.prefixCrumbs)
_this._resolveCrumbs(route)
.flatMap(function (x) { return x; })
.distinct(function (x) { return x.text; })
.toArray()
.flatMap(function (x) {
if (_this._config.postProcess) {
var y = _this._config.postProcess(x);
return wrapIntoObservable(y).first();
}
else {
return Observable.Observable.of(x);
}
})
.subscribe(function (x) {
_this._breadcrumbs.next(x);
});
});
}
Object.defineProperty(McBreadcrumbsService.prototype, "crumbs$", {
/**
* @return {?}
*/
get: function () {
return this._breadcrumbs;
},
enumerable: true,
configurable: true
});
/**
* @param {?} route
* @return {?}
*/
McBreadcrumbsService.prototype._resolveCrumbs = function (route) {
var /** @type {?} */ crumbs$;
var /** @type {?} */ data = route.routeConfig &&
route.routeConfig.data;
if (data && data.breadcrumbs) {
var /** @type {?} */ resolver = void 0;
if (data.breadcrumbs.prototype instanceof McBreadcrumbsResolver) {
resolver = this._injector.get(data.breadcrumbs);
}
else {
resolver = this._defaultResolver;
}
var /** @type {?} */ result = resolver.resolve(route, this._router.routerState.snapshot);
crumbs$ = wrapIntoObservable(result).first();
}
else {
crumbs$ = Observable.Observable.of([]);
}
if (route.firstChild) {
crumbs$ = crumbs$.concat(this._resolveCrumbs(route.firstChild));
}
return crumbs$;
};
return McBreadcrumbsService;
}());
McBreadcrumbsService.decorators = [
{ type: core.Injectable },
];
/**
* @nocollapse
*/
McBreadcrumbsService.ctorParameters = function () { return [
{ type: router.Router, },
{ type: router.ActivatedRoute, },
{ type: McBreadcrumbsConfig, },
{ type: core.Injector, },
]; };
var McBreadcrumbsComponent = (function () {
/**
* @param {?} service
*/
function McBreadcrumbsComponent(service) {
this.service = service;
this.subscriptions = new Array();
}
/**
* @return {?}
*/
McBreadcrumbsComponent.prototype.ngOnInit = function () {
var _this = this;
var /** @type {?} */ s = this.service.crumbs$.subscribe(function (x) {
_this.crumbs = x;
});
};
/**
* @return {?}
*/
McBreadcrumbsComponent.prototype.ngOnDestroy = function () {
this.subscriptions.forEach(function (x) { return x.unsubscribe(); });
};
return McBreadcrumbsComponent;
}());
McBreadcrumbsComponent.decorators = [
{ type: core.Component, args: [{
selector: 'mc-breadcrumbs',
template: "\n <ol *ngIf=\"crumbs.length\" class=\"breadcrumb\">\n <li *ngFor=\"let crumb of crumbs; let last = last\" [ngClass]=\"{ 'active': last }\" class=\"breadcrumb-item\">\n <a *ngIf=\"!last\" [routerLink]=\"crumb.path\">{{ crumb.text }}</a>\n <span *ngIf=\"last\">{{ crumb.text }}</span>\n </li>\n </ol>\n "
},] },
];
/**
* @nocollapse
*/
McBreadcrumbsComponent.ctorParameters = function () { return [
{ type: McBreadcrumbsService, },
]; };
var McBreadcrumbsModule = (function () {
function McBreadcrumbsModule() {
}
/**
* @return {?}
*/
McBreadcrumbsModule.forRoot = function () {
return {
ngModule: McBreadcrumbsModule,
providers: [
McBreadcrumbsService,
McBreadcrumbsConfig
]
};
};
return McBreadcrumbsModule;
}());
McBreadcrumbsModule.decorators = [
{ type: core.NgModule, args: [{
imports: [common.CommonModule, router.RouterModule],
declarations: [McBreadcrumbsComponent],
exports: [McBreadcrumbsComponent]
},] },
];
/**
* @nocollapse
*/
McBreadcrumbsModule.ctorParameters = function () { return []; };
exports.McBreadcrumbsComponent = McBreadcrumbsComponent;
exports.McBreadcrumbsService = McBreadcrumbsService;
exports.McBreadcrumbsConfig = McBreadcrumbsConfig;
exports.McBreadcrumbsResolver = McBreadcrumbsResolver;
exports.McBreadcrumbsModule = McBreadcrumbsModule;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=ngx-breadcrumbs.umd.js.map