@bespunky/angular-zen
Version:
The Angular tools you always wished were there.
68 lines • 8.87 kB
JavaScript
import { Attribute, Directive } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { Destroyable } from '@bespunky/angular-zen/core';
import { RouterOutletComponentBus } from './router-outlet-component-bus.service';
import * as i0 from "@angular/core";
import * as i1 from "@angular/router";
import * as i2 from "./router-outlet-component-bus.service";
/**
* Hooks into a router outlet's events and publishes the current component to the [`RouterOutletComponentBus`](/injectables/RouterOutletComponentBus.html) to create a mapping
* of component instances by outlet name.
*
* Components instantiated by outlets marked with `publishComponent` will be accessible by outlet name in the bus service.
*
* @example
* <!-- Component template -->
* <router-outlet publishComponent name="header"></router-outlet>
* <router-outlet publishComponent ></router-outlet>
* <router-outlet publishComponent name="footer"></router-outlet>
*
* @See `RouterOutletComponentBus` for more details.
*
* @export
* @class PublishComponentDirective
* @extends {Destroyable}
* @implements {OnInit}
*/
export class PublishComponentDirective extends Destroyable {
constructor(outlet, componentBus, outletName) {
super();
this.outlet = outlet;
this.componentBus = componentBus;
this.outletName = outletName;
}
/**
* Registers to outlet events to publish the activated and deactivated components to the bus. *
*/
ngOnInit() {
// When the outlet activates a new instance, update the component on the bus
this.subscribe(this.outlet.activateEvents, this.updateComponentOnBus.bind(this));
// When the outlet deactivates an instance, set the component to null on the bus.
this.subscribe(this.outlet.deactivateEvents, () => this.updateComponentOnBus(null));
}
/**
* Unpublishes the outlet from the bus.
*/
ngOnDestroy() {
// An outlet might be kept alive while its component is switched. So when the outlet is completely destroyed,
// it will be completely removed from the bus, even though its value on the bus is null.
this.componentBus.unpublishComponent(this.outletName);
super.ngOnDestroy();
}
updateComponentOnBus(instance) {
this.componentBus.publishComponent(instance, this.outletName);
}
}
PublishComponentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PublishComponentDirective, deps: [{ token: i1.RouterOutlet }, { token: i2.RouterOutletComponentBus }, { token: 'name', attribute: true }], target: i0.ɵɵFactoryTarget.Directive });
PublishComponentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.12", type: PublishComponentDirective, selector: "router-outlet[publishComponent]", usesInheritance: true, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PublishComponentDirective, decorators: [{
type: Directive,
args: [{
// eslint-disable-next-line @angular-eslint/directive-selector
selector: 'router-outlet[publishComponent]'
}]
}], ctorParameters: function () { return [{ type: i1.RouterOutlet }, { type: i2.RouterOutletComponentBus }, { type: undefined, decorators: [{
type: Attribute,
args: ['name']
}] }]; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGlzaC1jb21wb25lbnQuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyLXplbi9yb3V0ZXIteC9zcmMvb3V0bGV0L3B1Ymxpc2gtY29tcG9uZW50LmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFNBQVMsRUFBcUIsTUFBTSxlQUFlLENBQUM7QUFDeEUsT0FBTyxFQUFFLFlBQVksRUFBNkIsTUFBTSxpQkFBaUIsQ0FBQztBQUUxRSxPQUFPLEVBQUUsV0FBVyxFQUFlLE1BQU0sNEJBQTRCLENBQUM7QUFFdEUsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sdUNBQXVDLENBQUM7Ozs7QUFFakY7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQWtCRztBQUtILE1BQU0sT0FBTyx5QkFBMEIsU0FBUSxXQUFXO0lBRXRELFlBQ1ksTUFBb0IsRUFDcEIsWUFBc0MsRUFFdEMsVUFBa0I7UUFDMUIsS0FBSyxFQUFFLENBQUM7UUFKQSxXQUFNLEdBQU4sTUFBTSxDQUFjO1FBQ3BCLGlCQUFZLEdBQVosWUFBWSxDQUEwQjtRQUV0QyxlQUFVLEdBQVYsVUFBVSxDQUFRO0lBQ2pCLENBQUM7SUFFZDs7T0FFRztJQUNILFFBQVE7UUFFSiw0RUFBNEU7UUFDNUUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLGNBQWMsRUFBRSxJQUFJLENBQUMsb0JBQW9CLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7UUFDakYsaUZBQWlGO1FBQ2pGLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxnQkFBZ0IsRUFBRSxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsb0JBQW9CLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQztJQUN4RixDQUFDO0lBRUQ7O09BRUc7SUFDTSxXQUFXO1FBRWhCLDZHQUE2RztRQUM3Ryx3RkFBd0Y7UUFFeEYsSUFBSSxDQUFDLFlBQVksQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7UUFFdEQsS0FBSyxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3hCLENBQUM7SUFFTyxvQkFBb0IsQ0FBQyxRQUEwQjtRQUVuRCxJQUFJLENBQUMsWUFBWSxDQUFDLGdCQUFnQixDQUFDLFFBQVEsRUFBRSxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDbEUsQ0FBQzs7dUhBcENRLHlCQUF5QixzRkFLbkIsTUFBTTsyR0FMWix5QkFBeUI7NEZBQXpCLHlCQUF5QjtrQkFKckMsU0FBUzttQkFBQztvQkFDUCw4REFBOEQ7b0JBQzlELFFBQVEsRUFBRSxpQ0FBaUM7aUJBQzlDOzswQkFNUSxTQUFTOzJCQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBdHRyaWJ1dGUsIERpcmVjdGl2ZSwgT25EZXN0cm95LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFJvdXRlck91dGxldCAgICAgICAgICAgICAgICAgICAgICAgICAgICB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7XG5cbmltcG9ydCB7IERlc3Ryb3lhYmxlICAgICAgICAgICAgICB9IGZyb20gJ0BiZXNwdW5reS9hbmd1bGFyLXplbi9jb3JlJztcbmltcG9ydCB7IEFueU9iamVjdCAgICAgICAgICAgICAgICB9IGZyb20gJ0BiZXNwdW5reS90eXBlc2NyaXB0LXV0aWxzJztcbmltcG9ydCB7IFJvdXRlck91dGxldENvbXBvbmVudEJ1cyB9IGZyb20gJy4vcm91dGVyLW91dGxldC1jb21wb25lbnQtYnVzLnNlcnZpY2UnO1xuXG4vKipcbiAqIEhvb2tzIGludG8gYSByb3V0ZXIgb3V0bGV0J3MgZXZlbnRzIGFuZCBwdWJsaXNoZXMgdGhlIGN1cnJlbnQgY29tcG9uZW50IHRvIHRoZSBbYFJvdXRlck91dGxldENvbXBvbmVudEJ1c2BdKC9pbmplY3RhYmxlcy9Sb3V0ZXJPdXRsZXRDb21wb25lbnRCdXMuaHRtbCkgdG8gY3JlYXRlIGEgbWFwcGluZ1xuICogb2YgY29tcG9uZW50IGluc3RhbmNlcyBieSBvdXRsZXQgbmFtZS5cbiAqIFxuICogQ29tcG9uZW50cyBpbnN0YW50aWF0ZWQgYnkgb3V0bGV0cyBtYXJrZWQgd2l0aCBgcHVibGlzaENvbXBvbmVudGAgd2lsbCBiZSBhY2Nlc3NpYmxlIGJ5IG91dGxldCBuYW1lIGluIHRoZSBidXMgc2VydmljZS5cbiAqIFxuICogQGV4YW1wbGVcbiAqIDwhLS0gQ29tcG9uZW50IHRlbXBsYXRlIC0tPlxuICogPHJvdXRlci1vdXRsZXQgcHVibGlzaENvbXBvbmVudCBuYW1lPVwiaGVhZGVyXCI+PC9yb3V0ZXItb3V0bGV0PlxuICogPHJvdXRlci1vdXRsZXQgcHVibGlzaENvbXBvbmVudCAgICAgICAgICAgICAgPjwvcm91dGVyLW91dGxldD5cbiAqIDxyb3V0ZXItb3V0bGV0IHB1Ymxpc2hDb21wb25lbnQgbmFtZT1cImZvb3RlclwiPjwvcm91dGVyLW91dGxldD5cbiAqIFxuICogQFNlZSBgUm91dGVyT3V0bGV0Q29tcG9uZW50QnVzYCBmb3IgbW9yZSBkZXRhaWxzLlxuICogXG4gKiBAZXhwb3J0XG4gKiBAY2xhc3MgUHVibGlzaENvbXBvbmVudERpcmVjdGl2ZVxuICogQGV4dGVuZHMge0Rlc3Ryb3lhYmxlfVxuICogQGltcGxlbWVudHMge09uSW5pdH1cbiAqL1xuQERpcmVjdGl2ZSh7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEBhbmd1bGFyLWVzbGludC9kaXJlY3RpdmUtc2VsZWN0b3JcbiAgICBzZWxlY3RvcjogJ3JvdXRlci1vdXRsZXRbcHVibGlzaENvbXBvbmVudF0nXG59KVxuZXhwb3J0IGNsYXNzIFB1Ymxpc2hDb21wb25lbnREaXJlY3RpdmUgZXh0ZW5kcyBEZXN0cm95YWJsZSBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95XG57XG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgIHByaXZhdGUgb3V0bGV0OiBSb3V0ZXJPdXRsZXQsXG4gICAgICAgIHByaXZhdGUgY29tcG9uZW50QnVzOiBSb3V0ZXJPdXRsZXRDb21wb25lbnRCdXMsXG4gICAgICAgIEBBdHRyaWJ1dGUoJ25hbWUnKVxuICAgICAgICBwcml2YXRlIG91dGxldE5hbWU6IHN0cmluZ1xuICAgICkgeyBzdXBlcigpOyB9XG5cbiAgICAvKipcbiAgICAgKiBSZWdpc3RlcnMgdG8gb3V0bGV0IGV2ZW50cyB0byBwdWJsaXNoIHRoZSBhY3RpdmF0ZWQgYW5kIGRlYWN0aXZhdGVkIGNvbXBvbmVudHMgdG8gdGhlIGJ1cy4gICAgICpcbiAgICAgKi9cbiAgICBuZ09uSW5pdCgpXG4gICAge1xuICAgICAgICAvLyBXaGVuIHRoZSBvdXRsZXQgYWN0aXZhdGVzIGEgbmV3IGluc3RhbmNlLCB1cGRhdGUgdGhlIGNvbXBvbmVudCBvbiB0aGUgYnVzXG4gICAgICAgIHRoaXMuc3Vic2NyaWJlKHRoaXMub3V0bGV0LmFjdGl2YXRlRXZlbnRzLCB0aGlzLnVwZGF0ZUNvbXBvbmVudE9uQnVzLmJpbmQodGhpcykpO1xuICAgICAgICAvLyBXaGVuIHRoZSBvdXRsZXQgZGVhY3RpdmF0ZXMgYW4gaW5zdGFuY2UsIHNldCB0aGUgY29tcG9uZW50IHRvIG51bGwgb24gdGhlIGJ1cy5cbiAgICAgICAgdGhpcy5zdWJzY3JpYmUodGhpcy5vdXRsZXQuZGVhY3RpdmF0ZUV2ZW50cywgKCkgPT4gdGhpcy51cGRhdGVDb21wb25lbnRPbkJ1cyhudWxsKSk7XG4gICAgfVxuXG4gICAgLyoqXG4gICAgICogVW5wdWJsaXNoZXMgdGhlIG91dGxldCBmcm9tIHRoZSBidXMuXG4gICAgICovXG4gICAgb3ZlcnJpZGUgbmdPbkRlc3Ryb3koKVxuICAgIHtcbiAgICAgICAgLy8gQW4gb3V0bGV0IG1pZ2h0IGJlIGtlcHQgYWxpdmUgd2hpbGUgaXRzIGNvbXBvbmVudCBpcyBzd2l0Y2hlZC4gU28gd2hlbiB0aGUgb3V0bGV0IGlzIGNvbXBsZXRlbHkgZGVzdHJveWVkLFxuICAgICAgICAvLyBpdCB3aWxsIGJlIGNvbXBsZXRlbHkgcmVtb3ZlZCBmcm9tIHRoZSBidXMsIGV2ZW4gdGhvdWdoIGl0cyB2YWx1ZSBvbiB0aGUgYnVzIGlzIG51bGwuXG5cbiAgICAgICAgdGhpcy5jb21wb25lbnRCdXMudW5wdWJsaXNoQ29tcG9uZW50KHRoaXMub3V0bGV0TmFtZSk7XG5cbiAgICAgICAgc3VwZXIubmdPbkRlc3Ryb3koKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIHVwZGF0ZUNvbXBvbmVudE9uQnVzKGluc3RhbmNlOiBBbnlPYmplY3QgfCBudWxsKTogdm9pZFxuICAgIHtcbiAgICAgICAgdGhpcy5jb21wb25lbnRCdXMucHVibGlzaENvbXBvbmVudChpbnN0YW5jZSwgdGhpcy5vdXRsZXROYW1lKTsgICAgICAgIFxuICAgIH1cbn0iXX0=