diff --git a/libs/angular-webcomponents/src/lib/utils/webcomponent-bootstrap.utils.ts b/libs/angular-webcomponents/src/lib/utils/webcomponent-bootstrap.utils.ts index a3e4e086..1065e2dd 100644 --- a/libs/angular-webcomponents/src/lib/utils/webcomponent-bootstrap.utils.ts +++ b/libs/angular-webcomponents/src/lib/utils/webcomponent-bootstrap.utils.ts @@ -23,6 +23,7 @@ import { Subscription, filter } from 'rxjs' */ export type AppType = 'shell' | 'microfrontend' +export type EntrypointType = 'microfrontend' | 'component' export function bootstrapModule(module: Type, appType: AppType, production: boolean): Promise> { return cachePlatform(production) @@ -57,27 +58,32 @@ export async function bootstrapRemoteComponent( cachePlatform(production) adaptRemoteComponentRoutes(app.injector) - const sub = connectMicroFrontendRouter(app.injector, false) - - createEntrypoint(component, elementName, app.injector, sub) + createEntrypoint(component, elementName, app.injector, 'component') } export function createAppEntrypoint(component: Type, elementName: string, injector: Injector) { - const sub = connectMicroFrontendRouter(injector) - createEntrypoint(component, elementName, injector, sub) + createEntrypoint(component, elementName, injector, 'microfrontend') } function createEntrypoint( component: Type, elementName: string, injector: Injector, - routerSub?: Subscription | null + entrypointType: EntrypointType ) { - const originalNgDestroy = component.prototype.ngOnDestroy?.bind(component) - component.prototype.ngOnDestroy = () => { - routerSub?.unsubscribe() + let sub: Subscription | null + const originalNgInit = component.prototype.ngOnInit + component.prototype.ngOnInit = function () { + sub = connectMicroFrontendRouter(injector, entrypointType === 'microfrontend') + if (originalNgInit !== undefined) { + originalNgInit.call(this) + } + } + const originalNgDestroy = component.prototype.ngOnDestroy + component.prototype.ngOnDestroy = function () { + sub?.unsubscribe() if (originalNgDestroy !== undefined) { - originalNgDestroy() + originalNgDestroy.call(this) } }