diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/error/error.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/error/error.component.ts index b06475ac7a..cc64e5445b 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/error/error.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/error/error.component.ts @@ -8,6 +8,8 @@ import { OnDestroy, Type, ViewChild, + ApplicationRef, + Injector, } from '@angular/core'; import { fromEvent, Subject } from 'rxjs'; import { debounceTime, filter } from 'rxjs/operators'; @@ -18,8 +20,12 @@ import { debounceTime, filter } from 'rxjs/operators'; styleUrls: ['error.component.scss'], }) export class ErrorComponent implements AfterViewInit, OnDestroy { + appRef: ApplicationRef; + cfRes: ComponentFactoryResolver; + injector: Injector; + status = 0; title: Config.LocalizationParam = 'Oops!'; @@ -39,9 +45,10 @@ export class ErrorComponent implements AfterViewInit, OnDestroy { ngAfterViewInit() { if (this.customComponent) { - const customComponentRef = this.cfRes.resolveComponentFactory(this.customComponent).create(null); + const customComponentRef = this.cfRes.resolveComponentFactory(this.customComponent).create(this.injector); customComponentRef.instance.errorStatus = this.status; customComponentRef.instance.destroy$ = this.destroy$; + this.appRef.attachView(customComponentRef.hostView); this.containerRef.nativeElement.appendChild((customComponentRef.hostView as EmbeddedViewRef).rootNodes[0]); customComponentRef.changeDetectorRef.detectChanges(); } diff --git a/npm/ng-packs/packages/theme-shared/src/lib/handlers/error.handler.ts b/npm/ng-packs/packages/theme-shared/src/lib/handlers/error.handler.ts index ced1980067..ecf82cc9e1 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/handlers/error.handler.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/handlers/error.handler.ts @@ -212,6 +212,8 @@ export class ErrorHandler { if (this.canCreateCustomError(instance.status as ErrorScreenErrorCodes)) { this.componentRef.instance.cfRes = this.cfRes; + this.componentRef.instance.appRef = this.appRef; + this.componentRef.instance.injector = this.injector; this.componentRef.instance.customComponent = this.httpErrorConfig.errorScreen.component; }