fix(theme-shared): creating custom error component problem

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<any>).rootNodes[0]);
       customComponentRef.changeDetectorRef.detectChanges();
     }

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;
     }