ngx-dynamic-breadcrumb
Version:
33 lines • 8.43 kB
JavaScript
import { ChangeDetectionStrategy, Component, Input, } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/router";
import * as i2 from "./ngx-breadcrumb.service";
import * as i3 from "@angular/common";
export class NgxBreadcrumbComponent {
constructor(router, service) {
this.router = router;
this.service = service;
this.breadcrumbTemplate = null;
this.breadcrumbs$ = null;
}
ngOnInit() {
this.breadcrumbs$ = this.service.breadcrumbChanges;
}
navigateTo(path) {
this.router.navigate([path]);
}
}
NgxBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: NgxBreadcrumbComponent, deps: [{ token: i1.Router }, { token: i2.NgxBreadcrumbService }], target: i0.ɵɵFactoryTarget.Component });
NgxBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NgxBreadcrumbComponent, selector: "ngx-breadcrumb", inputs: { breadcrumbTemplate: "breadcrumbTemplate" }, ngImport: i0, template: "<div\r\n fxLayout=\"row\"\r\n fxLayoutAlign=\"space-between center\"\r\n class=\"ngx-breadcrumb-container\"\r\n>\r\n <nav aria-label=\"breadcrumb\">\r\n <ol class=\"breadcrumb\">\r\n <ng-container *ngIf=\"breadcrumbs$ | async as breadcrumbs\">\r\n <ng-container\r\n *ngFor=\"\r\n let breadcrumb of breadcrumbs;\r\n last as isLast;\r\n first as isFirst\r\n \"\r\n >\r\n <li *ngIf=\"breadcrumb.label\" class=\"breadcrumb-item\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"breadcrumbTemplate || defaultTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n breadcrumbArr: breadcrumbs,\r\n breadcrumb: breadcrumb,\r\n isLast: isLast,\r\n isFirst: isFirst\r\n }\"\r\n ></ng-container>\r\n </li>\r\n </ng-container>\r\n </ng-container>\r\n </ol>\r\n </nav>\r\n</div>\r\n\r\n<ng-template #defaultTemplate let-breadcrumb=\"breadcrumb\" let-isLast=\"isLast\">\r\n <a\r\n href=\"javascript:void(0)\"\r\n *ngIf=\"breadcrumb.isClickable\"\r\n (click)=\"navigateTo(breadcrumb.url)\"\r\n title=\"{{breadcrumb.tooltip}}\"\r\n >\r\n {{ breadcrumb.label }}\r\n </a>\r\n <span *ngIf=\"!isLast\" class=\"breadcrumb-separator\">/</span>\r\n</ng-template>\r\n", styles: [".breadcrumb{display:flex;flex-wrap:wrap;padding:0;list-style:none;margin:0}.breadcrumb-item{cursor:pointer;font-weight:500;font-size:16px;line-height:16px}.breadcrumb-item a{text-decoration:none;color:#ff008c}.breadcrumb-item span{color:#333!important}.breadcrumb-separator{margin:0 8px}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: NgxBreadcrumbComponent, decorators: [{
type: Component,
args: [{
selector: 'ngx-breadcrumb',
templateUrl: './ngx-breadcrumb.component.html',
styleUrls: ['./ngx-breadcrumb.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
}]
}], ctorParameters: function () { return [{ type: i1.Router }, { type: i2.NgxBreadcrumbService }]; }, propDecorators: { breadcrumbTemplate: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LWJyZWFkY3J1bWIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWJyZWFkY3J1bWIvc3JjL2xpYi9uZ3gtYnJlYWRjcnVtYi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtYnJlYWRjcnVtYi9zcmMvbGliL25neC1icmVhZGNydW1iLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULEtBQUssR0FHTixNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFhdkIsTUFBTSxPQUFPLHNCQUFzQjtJQU9qQyxZQUNtQixNQUFjLEVBQ2QsT0FBNkI7UUFEN0IsV0FBTSxHQUFOLE1BQU0sQ0FBUTtRQUNkLFlBQU8sR0FBUCxPQUFPLENBQXNCO1FBTmhELHVCQUFrQixHQUFvQyxJQUFJLENBQUM7UUFFM0QsaUJBQVksR0FBcUMsSUFBSSxDQUFDO0lBS25ELENBQUM7SUFFSixRQUFRO1FBQ04sSUFBSSxDQUFDLFlBQVksR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLGlCQUFpQixDQUFDO0lBQ3JELENBQUM7SUFFRCxVQUFVLENBQUMsSUFBWTtRQUNyQixJQUFJLENBQUMsTUFBTSxDQUFDLFFBQVEsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7SUFDL0IsQ0FBQzs7b0hBbEJVLHNCQUFzQjt3R0FBdEIsc0JBQXNCLDRHQ25CbkMseTJDQTJDQTs0RkR4QmEsc0JBQXNCO2tCQU5sQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxnQkFBZ0I7b0JBQzFCLFdBQVcsRUFBRSxpQ0FBaUM7b0JBQzlDLFNBQVMsRUFBRSxDQUFDLGlDQUFpQyxDQUFDO29CQUM5QyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtpQkFDaEQ7Z0lBSUMsa0JBQWtCO3NCQURqQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcclxuICBDb21wb25lbnQsXHJcbiAgSW5wdXQsXHJcbiAgT25Jbml0LFxyXG4gIFRlbXBsYXRlUmVmLFxyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBSb3V0ZXIgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xyXG5pbXBvcnQgeyBPYnNlcnZhYmxlLCBvZiB9IGZyb20gJ3J4anMnO1xyXG5cclxuaW1wb3J0IHsgTmd4QnJlYWRjcnVtYlNlcnZpY2UgfSBmcm9tICcuL25neC1icmVhZGNydW1iLnNlcnZpY2UnO1xyXG5pbXBvcnQgeyBJQnJlYWRjcnVtYiB9IGZyb20gJy4vbmd4LWJyZWFkY3J1bWIudHlwZXMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICduZ3gtYnJlYWRjcnVtYicsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL25neC1icmVhZGNydW1iLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9uZ3gtYnJlYWRjcnVtYi5jb21wb25lbnQuc2NzcyddLFxyXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgTmd4QnJlYWRjcnVtYkNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgYnJlYWRjcnVtYlRlbXBsYXRlOiBUZW1wbGF0ZVJlZjxJQnJlYWRjcnVtYj4gfCBudWxsID0gbnVsbDtcclxuXHJcbiAgYnJlYWRjcnVtYnMkOiBPYnNlcnZhYmxlPElCcmVhZGNydW1iW10+IHwgbnVsbCA9IG51bGw7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgcHJpdmF0ZSByZWFkb25seSByb3V0ZXI6IFJvdXRlcixcclxuICAgIHByaXZhdGUgcmVhZG9ubHkgc2VydmljZTogTmd4QnJlYWRjcnVtYlNlcnZpY2VcclxuICApIHt9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy5icmVhZGNydW1icyQgPSB0aGlzLnNlcnZpY2UuYnJlYWRjcnVtYkNoYW5nZXM7XHJcbiAgfVxyXG5cclxuICBuYXZpZ2F0ZVRvKHBhdGg6IHN0cmluZyk6IHZvaWQge1xyXG4gICAgdGhpcy5yb3V0ZXIubmF2aWdhdGUoW3BhdGhdKTtcclxuICB9XHJcbn1cclxuIiwiPGRpdlxyXG4gIGZ4TGF5b3V0PVwicm93XCJcclxuICBmeExheW91dEFsaWduPVwic3BhY2UtYmV0d2VlbiBjZW50ZXJcIlxyXG4gIGNsYXNzPVwibmd4LWJyZWFkY3J1bWItY29udGFpbmVyXCJcclxuPlxyXG4gIDxuYXYgYXJpYS1sYWJlbD1cImJyZWFkY3J1bWJcIj5cclxuICAgIDxvbCBjbGFzcz1cImJyZWFkY3J1bWJcIj5cclxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImJyZWFkY3J1bWJzJCB8IGFzeW5jIGFzIGJyZWFkY3J1bWJzXCI+XHJcbiAgICAgICAgPG5nLWNvbnRhaW5lclxyXG4gICAgICAgICAgKm5nRm9yPVwiXHJcbiAgICAgICAgICAgIGxldCBicmVhZGNydW1iIG9mIGJyZWFkY3J1bWJzO1xyXG4gICAgICAgICAgICBsYXN0IGFzIGlzTGFzdDtcclxuICAgICAgICAgICAgZmlyc3QgYXMgaXNGaXJzdFxyXG4gICAgICAgICAgXCJcclxuICAgICAgICA+XHJcbiAgICAgICAgICA8bGkgKm5nSWY9XCJicmVhZGNydW1iLmxhYmVsXCIgY2xhc3M9XCJicmVhZGNydW1iLWl0ZW1cIj5cclxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lclxyXG4gICAgICAgICAgICAgIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImJyZWFkY3J1bWJUZW1wbGF0ZSB8fCBkZWZhdWx0VGVtcGxhdGVcIlxyXG4gICAgICAgICAgICAgIFtuZ1RlbXBsYXRlT3V0bGV0Q29udGV4dF09XCJ7XHJcbiAgICAgICAgICAgICAgICBicmVhZGNydW1iQXJyOiBicmVhZGNydW1icyxcclxuICAgICAgICAgICAgICAgIGJyZWFkY3J1bWI6IGJyZWFkY3J1bWIsXHJcbiAgICAgICAgICAgICAgICBpc0xhc3Q6IGlzTGFzdCxcclxuICAgICAgICAgICAgICAgIGlzRmlyc3Q6IGlzRmlyc3RcclxuICAgICAgICAgICAgICB9XCJcclxuICAgICAgICAgICAgPjwvbmctY29udGFpbmVyPlxyXG4gICAgICAgICAgPC9saT5cclxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cclxuICAgICAgPC9uZy1jb250YWluZXI+XHJcbiAgICA8L29sPlxyXG4gIDwvbmF2PlxyXG48L2Rpdj5cclxuXHJcbjxuZy10ZW1wbGF0ZSAjZGVmYXVsdFRlbXBsYXRlIGxldC1icmVhZGNydW1iPVwiYnJlYWRjcnVtYlwiIGxldC1pc0xhc3Q9XCJpc0xhc3RcIj5cclxuICA8YVxyXG4gICAgaHJlZj1cImphdmFzY3JpcHQ6dm9pZCgwKVwiXHJcbiAgICAqbmdJZj1cImJyZWFkY3J1bWIuaXNDbGlja2FibGVcIlxyXG4gICAgKGNsaWNrKT1cIm5hdmlnYXRlVG8oYnJlYWRjcnVtYi51cmwpXCJcclxuICAgIHRpdGxlPVwie3ticmVhZGNydW1iLnRvb2x0aXB9fVwiXHJcbiAgPlxyXG4gICAge3sgYnJlYWRjcnVtYi5sYWJlbCB9fVxyXG4gIDwvYT5cclxuICA8c3BhbiAqbmdJZj1cIiFpc0xhc3RcIiBjbGFzcz1cImJyZWFkY3J1bWItc2VwYXJhdG9yXCI+Lzwvc3Bhbj5cclxuPC9uZy10ZW1wbGF0ZT5cclxuIl19