diff --git a/src/app/admin/admin-search-page/admin-search-results/admin-search-result-grid-element/item-search-result/item-admin-search-result-grid-element.component.ts b/src/app/admin/admin-search-page/admin-search-results/admin-search-result-grid-element/item-search-result/item-admin-search-result-grid-element.component.ts
index dab6694f368..36707187dd3 100644
--- a/src/app/admin/admin-search-page/admin-search-results/admin-search-result-grid-element/item-search-result/item-admin-search-result-grid-element.component.ts
+++ b/src/app/admin/admin-search-page/admin-search-results/admin-search-result-grid-element/item-search-result/item-admin-search-result-grid-element.component.ts
@@ -1,4 +1,4 @@
-import { Component, ComponentFactoryResolver, ElementRef, OnInit, ViewChild } from '@angular/core';
+import { Component, ElementRef, OnInit, ViewChild, ComponentRef, OnDestroy } from '@angular/core';
 import { Item } from '../../../../../core/shared/item.model';
 import { ViewMode } from '../../../../../core/shared/view-mode.model';
 import {
@@ -14,6 +14,7 @@ import { GenericConstructor } from '../../../../../core/shared/generic-construct
 import { ListableObjectDirective } from '../../../../../shared/object-collection/shared/listable-object/listable-object.directive';
 import { ThemeService } from '../../../../../shared/theme-support/theme.service';
 import { DSONameService } from '../../../../../core/breadcrumbs/dso-name.service';
+import { hasValue } from '../../../../../shared/empty.util';
 
 @listableObjectComponent(ItemSearchResult, ViewMode.GridElement, Context.AdminSearch)
 @Component({
@@ -24,17 +25,18 @@ import { DSONameService } from '../../../../../core/breadcrumbs/dso-name.service
 /**
  * The component for displaying a list element for an item search result on the admin search page
  */
-export class ItemAdminSearchResultGridElementComponent extends SearchResultGridElementComponent<ItemSearchResult, Item> implements OnInit {
+export class ItemAdminSearchResultGridElementComponent extends SearchResultGridElementComponent<ItemSearchResult, Item> implements OnDestroy, OnInit {
   @ViewChild(ListableObjectDirective, { static: true }) listableObjectDirective: ListableObjectDirective;
   @ViewChild('badges', { static: true }) badges: ElementRef;
   @ViewChild('buttons', { static: true }) buttons: ElementRef;
 
+  protected compRef: ComponentRef<Component>;
+
   constructor(
     public dsoNameService: DSONameService,
     protected truncatableService: TruncatableService,
     protected bitstreamDataService: BitstreamDataService,
     private themeService: ThemeService,
-    private componentFactoryResolver: ComponentFactoryResolver,
   ) {
     super(dsoNameService, truncatableService, bitstreamDataService);
   }
@@ -44,23 +46,32 @@ export class ItemAdminSearchResultGridElementComponent extends SearchResultGridE
    */
   ngOnInit(): void {
     super.ngOnInit();
-    const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.getComponent());
+    const component: GenericConstructor<Component> = this.getComponent();
 
     const viewContainerRef = this.listableObjectDirective.viewContainerRef;
     viewContainerRef.clear();
 
-    const componentRef = viewContainerRef.createComponent(
-      componentFactory,
-      0,
-      undefined,
-      [
-        [this.badges.nativeElement],
-        [this.buttons.nativeElement]
-      ]);
-    (componentRef.instance as any).object = this.object;
-    (componentRef.instance as any).index = this.index;
-    (componentRef.instance as any).linkType = this.linkType;
-    (componentRef.instance as any).listID = this.listID;
+    this.compRef = viewContainerRef.createComponent(
+      component, {
+        index: 0,
+        injector: undefined,
+        projectableNodes: [
+          [this.badges.nativeElement],
+          [this.buttons.nativeElement],
+        ],
+      },
+    );
+    this.compRef.setInput('object',this.object);
+    this.compRef.setInput('index', this.index);
+    this.compRef.setInput('linkType', this.linkType);
+    this.compRef.setInput('listID', this.listID);
+  }
+
+  ngOnDestroy(): void {
+    if (hasValue(this.compRef)) {
+      this.compRef.destroy();
+      this.compRef = undefined;
+    }
   }
 
   /**
diff --git a/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workflow-item/workflow-item-search-result-admin-workflow-grid-element.component.ts b/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workflow-item/workflow-item-search-result-admin-workflow-grid-element.component.ts
index fd9d21e227d..4c25a9f9983 100644
--- a/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workflow-item/workflow-item-search-result-admin-workflow-grid-element.component.ts
+++ b/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workflow-item/workflow-item-search-result-admin-workflow-grid-element.component.ts
@@ -1,4 +1,4 @@
-import { Component, ComponentFactoryResolver, ElementRef, ViewChild } from '@angular/core';
+import { Component, ElementRef, ViewChild, ComponentRef, OnDestroy, OnInit } from '@angular/core';
 import { Item } from '../../../../../core/shared/item.model';
 import { ViewMode } from '../../../../../core/shared/view-mode.model';
 import {
@@ -24,6 +24,7 @@ import { take } from 'rxjs/operators';
 import { WorkflowItemSearchResult } from '../../../../../shared/object-collection/shared/workflow-item-search-result.model';
 import { ThemeService } from '../../../../../shared/theme-support/theme.service';
 import { DSONameService } from '../../../../../core/breadcrumbs/dso-name.service';
+import { hasValue } from '../../../../../shared/empty.util';
 
 @listableObjectComponent(WorkflowItemSearchResult, ViewMode.GridElement, Context.AdminWorkflowSearch)
 @Component({
@@ -34,7 +35,7 @@ import { DSONameService } from '../../../../../core/breadcrumbs/dso-name.service
 /**
  * The component for displaying a grid element for an workflow item on the admin workflow search page
  */
-export class WorkflowItemSearchResultAdminWorkflowGridElementComponent extends SearchResultGridElementComponent<WorkflowItemSearchResult, WorkflowItem> {
+export class WorkflowItemSearchResultAdminWorkflowGridElementComponent extends SearchResultGridElementComponent<WorkflowItemSearchResult, WorkflowItem> implements OnDestroy, OnInit {
   /**
    * Directive used to render the dynamic component in
    */
@@ -55,9 +56,10 @@ export class WorkflowItemSearchResultAdminWorkflowGridElementComponent extends S
    */
   public item$: Observable<Item>;
 
+  protected compRef: ComponentRef<Component>;
+
   constructor(
     public dsoNameService: DSONameService,
-    private componentFactoryResolver: ComponentFactoryResolver,
     private linkService: LinkService,
     protected truncatableService: TruncatableService,
     private themeService: ThemeService,
@@ -75,26 +77,34 @@ export class WorkflowItemSearchResultAdminWorkflowGridElementComponent extends S
     this.dso = this.linkService.resolveLink(this.dso, followLink('item'));
     this.item$ = (this.dso.item as Observable<RemoteData<Item>>).pipe(getAllSucceededRemoteData(), getRemoteDataPayload());
     this.item$.pipe(take(1)).subscribe((item: Item) => {
-        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.getComponent(item));
+      const component: GenericConstructor<Component> = this.getComponent(item);
 
-        const viewContainerRef = this.listableObjectDirective.viewContainerRef;
-        viewContainerRef.clear();
+      const viewContainerRef = this.listableObjectDirective.viewContainerRef;
+      viewContainerRef.clear();
 
-        const componentRef = viewContainerRef.createComponent(
-          componentFactory,
-          0,
-          undefined,
-          [
+      this.compRef = viewContainerRef.createComponent(
+        component, {
+          index: 0,
+          injector: undefined,
+          projectableNodes: [
             [this.badges.nativeElement],
-            [this.buttons.nativeElement]
-          ]);
-        (componentRef.instance as any).object = item;
-        (componentRef.instance as any).index = this.index;
-        (componentRef.instance as any).linkType = this.linkType;
-        (componentRef.instance as any).listID = this.listID;
-        componentRef.changeDetectorRef.detectChanges();
-      }
-    );
+            [this.buttons.nativeElement],
+          ],
+        },
+      );
+      this.compRef.setInput('object', item);
+      this.compRef.setInput('index', this.index);
+      this.compRef.setInput('linkType', this.linkType);
+      this.compRef.setInput('listID', this.listID);
+      this.compRef.changeDetectorRef.detectChanges();
+    });
+  }
+
+  ngOnDestroy(): void {
+    if (hasValue(this.compRef)) {
+      this.compRef.destroy();
+      this.compRef = undefined;
+    }
   }
 
   /**
diff --git a/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workspace-item/workspace-item-search-result-admin-workflow-grid-element.component.ts b/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workspace-item/workspace-item-search-result-admin-workflow-grid-element.component.ts
index d6f39e79feb..9404b02a2a5 100644
--- a/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workspace-item/workspace-item-search-result-admin-workflow-grid-element.component.ts
+++ b/src/app/admin/admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workspace-item/workspace-item-search-result-admin-workflow-grid-element.component.ts
@@ -1,4 +1,4 @@
-import { Component, ComponentFactoryResolver, ElementRef, ViewChild, OnInit } from '@angular/core';
+import { Component, ElementRef, ViewChild, OnInit, OnDestroy, ComponentRef } from '@angular/core';
 
 import { BehaviorSubject, Observable } from 'rxjs';
 import { map, mergeMap, take, tap } from 'rxjs/operators';
@@ -37,6 +37,7 @@ import { SupervisionOrder } from '../../../../../core/supervision-order/models/s
 import { PaginatedList } from '../../../../../core/data/paginated-list.model';
 import { SupervisionOrderDataService } from '../../../../../core/supervision-order/supervision-order-data.service';
 import { DSONameService } from '../../../../../core/breadcrumbs/dso-name.service';
+import { hasValue } from '../../../../../shared/empty.util';
 
 @listableObjectComponent(WorkspaceItemSearchResult, ViewMode.GridElement, Context.AdminWorkflowSearch)
 @Component({
@@ -47,7 +48,7 @@ import { DSONameService } from '../../../../../core/breadcrumbs/dso-name.service
 /**
  * The component for displaying a grid element for an workflow item on the admin workflow search page
  */
-export class WorkspaceItemSearchResultAdminWorkflowGridElementComponent extends SearchResultGridElementComponent<WorkspaceItemSearchResult, WorkspaceItem> implements OnInit {
+export class WorkspaceItemSearchResultAdminWorkflowGridElementComponent extends SearchResultGridElementComponent<WorkspaceItemSearchResult, WorkspaceItem> implements OnDestroy, OnInit {
 
   /**
    * The item linked to the workspace item
@@ -79,9 +80,13 @@ export class WorkspaceItemSearchResultAdminWorkflowGridElementComponent extends
    */
   @ViewChild('buttons', { static: true }) buttons: ElementRef;
 
+  /**
+   * The reference to the dynamic component
+   */
+  protected compRef: ComponentRef<Component>;
+
   constructor(
     public dsoNameService: DSONameService,
-    private componentFactoryResolver: ComponentFactoryResolver,
     private linkService: LinkService,
     protected truncatableService: TruncatableService,
     private themeService: ThemeService,
@@ -100,24 +105,24 @@ export class WorkspaceItemSearchResultAdminWorkflowGridElementComponent extends
     this.dso = this.linkService.resolveLink(this.dso, followLink('item'));
     this.item$ = (this.dso.item as Observable<RemoteData<Item>>).pipe(getAllSucceededRemoteData(), getRemoteDataPayload());
     this.item$.pipe(take(1)).subscribe((item: Item) => {
-        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.getComponent(item));
+        const component: GenericConstructor<Component> = this.getComponent(item);
 
         const viewContainerRef = this.listableObjectDirective.viewContainerRef;
         viewContainerRef.clear();
 
-        const componentRef = viewContainerRef.createComponent(
-          componentFactory,
-          0,
-          undefined,
-          [
+        this.compRef = viewContainerRef.createComponent(
+          component, {
+          index: 0,
+          projectableNodes: [
             [this.badges.nativeElement],
             [this.buttons.nativeElement]
-          ]);
-        (componentRef.instance as any).object = item;
-        (componentRef.instance as any).index = this.index;
-        (componentRef.instance as any).linkType = this.linkType;
-        (componentRef.instance as any).listID = this.listID;
-        componentRef.changeDetectorRef.detectChanges();
+          ],
+        });
+        this.compRef.setInput('object', item);
+        this.compRef.setInput('index', this.index);
+        this.compRef.setInput('linkType', this.linkType);
+        this.compRef.setInput('listID', this.listID);
+        this.compRef.changeDetectorRef.detectChanges();
       }
     );
 
@@ -130,6 +135,13 @@ export class WorkspaceItemSearchResultAdminWorkflowGridElementComponent extends
     });
   }
 
+  ngOnDestroy(): void {
+    if (hasValue(this.compRef)) {
+      this.compRef.destroy();
+      this.compRef = undefined;
+    }
+  }
+
   /**
    * Fetch the component depending on the item's entity type, view mode and context
    * @returns {GenericConstructor<Component>}
diff --git a/src/app/shared/comcol/comcol-page-browse-by/comcol-page-browse-by.component.html b/src/app/shared/comcol/comcol-page-browse-by/comcol-page-browse-by.component.html
index 504d9f4bcd6..c0ead4f46a2 100644
--- a/src/app/shared/comcol/comcol-page-browse-by/comcol-page-browse-by.component.html
+++ b/src/app/shared/comcol/comcol-page-browse-by/comcol-page-browse-by.component.html
@@ -2,12 +2,14 @@ <h2 class="comcol-browse-label h5">{{'browse.comcol.head' | translate}}</h2>
 <nav class="comcol-browse mb-4" aria-label="Browse Community or Collection">
   <div class="d-none d-sm-block">
 
-    <div class="list-group list-group-horizontal">
+    <div class="list-group list-group-horizontal" role="tablist">
       <a *ngFor="let option of allOptions"
+         [attr.aria-current]="(currentOptionId$ | async) === option.id"
          class="list-group-item"
+         role="tab"
          [routerLink]="option.routerLink"
          [queryParams]="option.params"
-         routerLinkActive="active">{{ option.label | translate }}</a>
+         [class.active]="(currentOptionId$ | async) === option.id">{{ option.label | translate }}</a>
     </div>
   </div>
 
diff --git a/src/app/shared/context-help.directive.ts b/src/app/shared/context-help.directive.ts
index 41d6daec21c..52a822de2c4 100644
--- a/src/app/shared/context-help.directive.ts
+++ b/src/app/shared/context-help.directive.ts
@@ -1,5 +1,4 @@
 import {
-  ComponentFactoryResolver,
   ComponentRef,
   Directive,
   Input,
@@ -12,6 +11,7 @@ import { PlacementArray } from '@ng-bootstrap/ng-bootstrap/util/positioning';
 import { ContextHelpWrapperComponent } from './context-help-wrapper/context-help-wrapper.component';
 import { PlacementDir } from './context-help-wrapper/placement-dir.model';
 import { ContextHelpService } from './context-help.service';
+import { hasValue } from './empty.util';
 
 export interface ContextHelpDirectiveInput {
   content: string;
@@ -43,7 +43,6 @@ export class ContextHelpDirective implements OnChanges, OnDestroy {
   constructor(
     private templateRef: TemplateRef<any>,
     private viewContainerRef: ViewContainerRef,
-    private componentFactoryResolver: ComponentFactoryResolver,
     private contextHelpService: ContextHelpService
   ) {}
 
@@ -53,19 +52,21 @@ export class ContextHelpDirective implements OnChanges, OnDestroy {
     this.contextHelpService.add({id: this.dsContextHelp.id, isTooltipVisible: false});
 
     if (this.wrapper === undefined) {
-      const factory
-        = this.componentFactoryResolver.resolveComponentFactory(ContextHelpWrapperComponent);
-      this.wrapper = this.viewContainerRef.createComponent(factory);
+      this.wrapper = this.viewContainerRef.createComponent(ContextHelpWrapperComponent);
     }
-    this.wrapper.instance.templateRef = this.templateRef;
-    this.wrapper.instance.content = this.dsContextHelp.content;
-    this.wrapper.instance.id = this.dsContextHelp.id;
-    this.wrapper.instance.tooltipPlacement = this.dsContextHelp.tooltipPlacement;
-    this.wrapper.instance.iconPlacement = this.dsContextHelp.iconPlacement;
+    this.wrapper.setInput('templateRef', this.templateRef);
+    this.wrapper.setInput('content', this.dsContextHelp.content);
+    this.wrapper.setInput('id', this.dsContextHelp.id);
+    this.wrapper.setInput('tooltipPlacement', this.dsContextHelp.tooltipPlacement);
+    this.wrapper.setInput('iconPlacement', this.dsContextHelp.iconPlacement);
   }
 
   ngOnDestroy() {
     this.clearMostRecentId();
+    if (hasValue(this.wrapper)) {
+      this.wrapper.destroy();
+      this.wrapper = undefined;
+    }
   }
 
   private clearMostRecentId(): void {
diff --git a/src/app/shared/loading/themed-loading.component.ts b/src/app/shared/loading/themed-loading.component.ts
index 48773d75c81..de2d602fc4d 100644
--- a/src/app/shared/loading/themed-loading.component.ts
+++ b/src/app/shared/loading/themed-loading.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, ComponentFactoryResolver, ChangeDetectorRef } from '@angular/core';
+import { Component, Input, ChangeDetectorRef } from '@angular/core';
 import { ThemedComponent } from '../theme-support/themed.component';
 import { LoadingComponent } from './loading.component';
 import { ThemeService } from '../theme-support/theme.service';
@@ -20,11 +20,10 @@ export class ThemedLoadingComponent extends ThemedComponent<LoadingComponent> {
   protected inAndOutputNames: (keyof LoadingComponent & keyof this)[] = ['message', 'showMessage', 'spinner'];
 
   constructor(
-    protected resolver: ComponentFactoryResolver,
     protected cdr: ChangeDetectorRef,
     protected themeService: ThemeService
   ) {
-    super(resolver, cdr, themeService);
+    super(cdr, themeService);
   }
 
   protected getComponentName(): string {
diff --git a/src/app/shared/metadata-representation/metadata-representation-loader.component.ts b/src/app/shared/metadata-representation/metadata-representation-loader.component.ts
index 42ee093278a..a72177e3288 100644
--- a/src/app/shared/metadata-representation/metadata-representation-loader.component.ts
+++ b/src/app/shared/metadata-representation/metadata-representation-loader.component.ts
@@ -1,4 +1,4 @@
-import { Component, ComponentFactoryResolver, Inject, Input, OnInit, ViewChild, OnChanges, SimpleChanges, ComponentRef, ViewContainerRef, ComponentFactory } from '@angular/core';
+import { Component, Inject, Input, OnInit, ViewChild, OnChanges, OnDestroy, SimpleChanges, ComponentRef, ViewContainerRef } from '@angular/core';
 import {
   MetadataRepresentation,
   MetadataRepresentationType
@@ -18,8 +18,7 @@ import { ThemeService } from '../theme-support/theme.service';
 /**
  * Component for determining what component to use depending on the item's entity type (dspace.entity.type), its metadata representation and, optionally, its context
  */
-export class MetadataRepresentationLoaderComponent implements OnInit, OnChanges {
-
+export class MetadataRepresentationLoaderComponent implements OnDestroy, OnInit, OnChanges {
   /**
    * The item or metadata to determine the component for
    */
@@ -55,7 +54,6 @@ export class MetadataRepresentationLoaderComponent implements OnInit, OnChanges
   ];
 
   constructor(
-    private componentFactoryResolver: ComponentFactoryResolver,
     private themeService: ThemeService,
     @Inject(METADATA_REPRESENTATION_COMPONENT_FACTORY) private getMetadataRepresentationComponent: (entityType: string, mdRepresentationType: MetadataRepresentationType, context: Context, theme: string) => GenericConstructor<any>,
   ) {
@@ -65,7 +63,9 @@ export class MetadataRepresentationLoaderComponent implements OnInit, OnChanges
    * Set up the dynamic child component
    */
   ngOnInit(): void {
-    this.instantiateComponent();
+    if (hasNoValue(this.compRef)) {
+      this.instantiateComponent();
+    }
   }
 
   /**
@@ -88,12 +88,12 @@ export class MetadataRepresentationLoaderComponent implements OnInit, OnChanges
   }
 
   private instantiateComponent(changes?: SimpleChanges): void {
-    const componentFactory: ComponentFactory<MetadataRepresentationListElementComponent> = this.componentFactoryResolver.resolveComponentFactory(this.getComponent());
+    const component: GenericConstructor<MetadataRepresentationListElementComponent> = this.getComponent();
 
     const viewContainerRef: ViewContainerRef = this.mdRepDirective.viewContainerRef;
     viewContainerRef.clear();
 
-    this.compRef = viewContainerRef.createComponent(componentFactory);
+    this.compRef = viewContainerRef.createComponent(component);
 
     if (hasValue(changes)) {
       this.ngOnChanges(changes);
@@ -102,6 +102,13 @@ export class MetadataRepresentationLoaderComponent implements OnInit, OnChanges
     }
   }
 
+  ngOnDestroy(): void {
+    if (hasValue(this.compRef)) {
+      this.compRef.destroy();
+      this.compRef = undefined;
+    }
+  }
+
   /**
    * Fetch the component depending on the item's entity type, metadata representation type and context
    * @returns {string}
diff --git a/src/app/shared/mydspace-actions/claimed-task/switcher/claimed-task-actions-loader.component.ts b/src/app/shared/mydspace-actions/claimed-task/switcher/claimed-task-actions-loader.component.ts
index c0dc1cad02b..d33516fcb8a 100644
--- a/src/app/shared/mydspace-actions/claimed-task/switcher/claimed-task-actions-loader.component.ts
+++ b/src/app/shared/mydspace-actions/claimed-task/switcher/claimed-task-actions-loader.component.ts
@@ -1,8 +1,8 @@
 import {
   Component,
-  ComponentFactoryResolver,
   EventEmitter,
   Input,
+  OnDestroy,
   OnInit,
   Output,
   ViewChild,
@@ -27,7 +27,7 @@ import { ClaimedTaskActionsAbstractComponent } from '../abstract/claimed-task-ac
  * Component for loading a ClaimedTaskAction component depending on the "option" input
  * Passes on the ClaimedTask to the component and subscribes to the processCompleted output
  */
-export class ClaimedTaskActionsLoaderComponent implements OnInit, OnChanges {
+export class ClaimedTaskActionsLoaderComponent implements OnInit, OnChanges, OnDestroy {
   /**
    * The item object that belonging to the ClaimedTask object
    */
@@ -68,19 +68,20 @@ export class ClaimedTaskActionsLoaderComponent implements OnInit, OnChanges {
    * The list of input and output names for the dynamic component
    */
   protected inAndOutputNames: (keyof ClaimedTaskActionsAbstractComponent & keyof this)[] = [
+    'item',
     'object',
     'option',
+    'workflowitem',
     'processCompleted',
   ];
 
-  constructor(private componentFactoryResolver: ComponentFactoryResolver) {
-  }
-
   /**
    * Fetch, create and initialize the relevant component
    */
   ngOnInit(): void {
-    this.instantiateComponent();
+    if (hasNoValue(this.compRef)) {
+      this.instantiateComponent();
+    }
   }
 
   /**
@@ -105,12 +106,10 @@ export class ClaimedTaskActionsLoaderComponent implements OnInit, OnChanges {
   private instantiateComponent(changes?: SimpleChanges): void {
     const comp = this.getComponentByWorkflowTaskOption(this.option);
     if (hasValue(comp)) {
-      const componentFactory = this.componentFactoryResolver.resolveComponentFactory(comp);
-
       const viewContainerRef = this.claimedTaskActionsDirective.viewContainerRef;
       viewContainerRef.clear();
 
-      this.compRef = viewContainerRef.createComponent(componentFactory);
+      this.compRef = viewContainerRef.createComponent(comp);
 
       if (hasValue(changes)) {
         this.ngOnChanges(changes);
@@ -135,4 +134,11 @@ export class ClaimedTaskActionsLoaderComponent implements OnInit, OnChanges {
       });
     }
   }
+
+  ngOnDestroy(): void {
+    if (hasValue(this.compRef)) {
+      this.compRef.destroy();
+      this.compRef = undefined;
+    }
+  }
 }
diff --git a/src/app/shared/object-collection/shared/listable-object/listable-object-component-loader.component.ts b/src/app/shared/object-collection/shared/listable-object/listable-object-component-loader.component.ts
index 7a3cc42bf5a..3152f5c7b3c 100644
--- a/src/app/shared/object-collection/shared/listable-object/listable-object-component-loader.component.ts
+++ b/src/app/shared/object-collection/shared/listable-object/listable-object-component-loader.component.ts
@@ -125,7 +125,9 @@ export class ListableObjectComponentLoaderComponent implements OnInit, OnChanges
    * Setup the dynamic child component
    */
   ngOnInit(): void {
-    this.instantiateComponent(this.object);
+    if (hasNoValue(this.compRef)) {
+      this.instantiateComponent(this.object);
+    }
   }
 
   /**
@@ -147,7 +149,11 @@ export class ListableObjectComponentLoaderComponent implements OnInit, OnChanges
     }
   }
 
-  ngOnDestroy() {
+  ngOnDestroy(): void {
+    if (hasValue(this.compRef)) {
+      this.compRef.destroy();
+      this.compRef = undefined;
+    }
     this.subs
       .filter((subscription) => hasValue(subscription))
       .forEach((subscription) => subscription.unsubscribe());
diff --git a/src/app/shared/theme-support/themed.component.ts b/src/app/shared/theme-support/themed.component.ts
index ded83aaf326..0d2833b33fc 100644
--- a/src/app/shared/theme-support/themed.component.ts
+++ b/src/app/shared/theme-support/themed.component.ts
@@ -6,7 +6,6 @@ import {
   ComponentRef,
   SimpleChanges,
   OnDestroy,
-  ComponentFactoryResolver,
   ChangeDetectorRef,
   OnChanges,
   HostBinding,
@@ -47,7 +46,6 @@ export abstract class ThemedComponent<T> implements AfterViewInit, OnDestroy, On
   @HostBinding('attr.data-used-theme') usedTheme: string;
 
   constructor(
-    protected resolver: ComponentFactoryResolver,
     protected cdr: ChangeDetectorRef,
     protected themeService: ThemeService,
   ) {
@@ -118,8 +116,9 @@ export abstract class ThemedComponent<T> implements AfterViewInit, OnDestroy, On
 
     this.lazyLoadSub = this.lazyLoadObs.subscribe(([simpleChanges, constructor]: [SimpleChanges, GenericConstructor<T>]) => {
       this.destroyComponentInstance();
-      const factory = this.resolver.resolveComponentFactory(constructor);
-      this.compRef = this.vcr.createComponent(factory, undefined, undefined, [this.themedElementContent.nativeElement.childNodes]);
+      this.compRef = this.vcr.createComponent(constructor, {
+        projectableNodes: [this.themedElementContent.nativeElement.childNodes],
+      });
       if (hasValue(simpleChanges)) {
         this.ngOnChanges(simpleChanges);
       } else {
diff --git a/src/app/workflowitems-edit-page/advanced-workflow-action/advanced-workflow-actions-loader/advanced-workflow-actions-loader.component.ts b/src/app/workflowitems-edit-page/advanced-workflow-action/advanced-workflow-actions-loader/advanced-workflow-actions-loader.component.ts
index 32f14c015de..db47c6638ff 100644
--- a/src/app/workflowitems-edit-page/advanced-workflow-action/advanced-workflow-actions-loader/advanced-workflow-actions-loader.component.ts
+++ b/src/app/workflowitems-edit-page/advanced-workflow-action/advanced-workflow-actions-loader/advanced-workflow-actions-loader.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, ViewChild, ComponentFactoryResolver, OnInit } from '@angular/core';
+import { Component, Input, ViewChild, OnInit, ComponentRef, OnDestroy } from '@angular/core';
 import { hasValue } from '../../../shared/empty.util';
 import {
   getAdvancedComponentByWorkflowTaskOption
@@ -15,7 +15,7 @@ import { PAGE_NOT_FOUND_PATH } from '../../../app-routing-paths';
   templateUrl: './advanced-workflow-actions-loader.component.html',
   styleUrls: ['./advanced-workflow-actions-loader.component.scss'],
 })
-export class AdvancedWorkflowActionsLoaderComponent implements OnInit {
+export class AdvancedWorkflowActionsLoaderComponent implements OnDestroy, OnInit {
 
   /**
    * The name of the type to render
@@ -28,8 +28,12 @@ export class AdvancedWorkflowActionsLoaderComponent implements OnInit {
    */
   @ViewChild(AdvancedWorkflowActionsDirective, { static: true }) claimedTaskActionsDirective: AdvancedWorkflowActionsDirective;
 
+  /**
+   * The reference to the dynamic component
+   */
+  protected compRef: ComponentRef<Component>;
+
   constructor(
-    private componentFactoryResolver: ComponentFactoryResolver,
     private router: Router,
   ) {
   }
@@ -40,16 +44,24 @@ export class AdvancedWorkflowActionsLoaderComponent implements OnInit {
   ngOnInit(): void {
     const comp = this.getComponentByWorkflowTaskOption(this.type);
     if (hasValue(comp)) {
-      const componentFactory = this.componentFactoryResolver.resolveComponentFactory(comp);
-
       const viewContainerRef = this.claimedTaskActionsDirective.viewContainerRef;
       viewContainerRef.clear();
-      viewContainerRef.createComponent(componentFactory);
+      this.compRef = viewContainerRef.createComponent(comp);
     } else {
       void this.router.navigate([PAGE_NOT_FOUND_PATH]);
     }
   }
 
+  /**
+   * Destroy the dynamically created component
+   */
+  ngOnDestroy(): void {
+    if (hasValue(this.compRef)) {
+      this.compRef.destroy();
+      this.compRef = undefined;
+    }
+  }
+
   getComponentByWorkflowTaskOption(type: string): any {
     return getAdvancedComponentByWorkflowTaskOption(type);
   }