fix(deps): update dependency angular-in-memory-web-api to ^0.19.0

package-lock.json

@@ -16,7 +16,7 @@
         "@angular/platform-browser": "^19.0.0",
         "@angular/platform-browser-dynamic": "^19.0.0",
         "@angular/router": "^19.0.0",
-        "angular-in-memory-web-api": "^0.18.0",
+        "angular-in-memory-web-api": "^0.19.0",
         "rxjs": "~7.8.0",
         "tslib": "^2.3.0",
         "zone.js": "~0.15.0"
@@ -5761,16 +5761,16 @@
       }
     },
     "node_modules/angular-in-memory-web-api": {
-      "version": "0.18.0",
-      "resolved": "https://registry.npmjs.org/angular-in-memory-web-api/-/angular-in-memory-web-api-0.18.0.tgz",
-      "integrity": "sha512-Eqkr9+x3d7K4dmn6Qs3ZVAfqBDPZN0N7Qel5i8eU/pe5r44J/pfxlNW+1LC2Sb2PdENEdvFzC8wx8qly5+kQyQ==",
+      "version": "0.19.0",
+      "resolved": "https://registry.npmjs.org/angular-in-memory-web-api/-/angular-in-memory-web-api-0.19.0.tgz",
+      "integrity": "sha512-o3N46wjUjqVwfJ+14tHc1K5lpSF9RA/6HqR46Mh/K6bFnYgaPiI/qcPkFLxPvTYP8uQQywVmD76q3n6kNBldzA==",
       "license": "MIT",
       "dependencies": {
         "tslib": "^2.3.0"
       },
       "peerDependencies": {
-        "@angular/common": "^18.0.0",
-        "@angular/core": "^18.0.0",
+        "@angular/common": "^19.0.0",
+        "@angular/core": "^19.0.0",
         "rxjs": "^6.5.3 || ^7.4.0"
       }
     },

package.json

@@ -18,7 +18,7 @@
     "@angular/platform-browser": "^19.0.0",
     "@angular/platform-browser-dynamic": "^19.0.0",
     "@angular/router": "^19.0.0",
-    "angular-in-memory-web-api": "^0.18.0",
+    "angular-in-memory-web-api": "^0.19.0",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.15.0"

src/app/app.routes.ts

@@ -1,14 +1,12 @@
 import { Routes } from '@angular/router';
+import { HotelListComponent } from './hotel-list/hotel-list.component';
 import { TestComponent } from './test/test.component';
 import { NewHotelComponent } from './new-hotel/new-hotel.component';
 
 export const routes: Routes = [
   {
     path: '',
-    loadComponent: () =>
-      import('./hotel-list/hotel-list.component').then(
-        (c) => c.HotelListComponent,
-      ),
+    component: HotelListComponent,
   },
   {
     path: 'hotels/:id',

src/app/hotel-list/hotel-list.component.html

@@ -1,5 +1,7 @@
 <div class="container p-4 mx-auto max-w-4xl">
-  <h1>{{ "hello" | uppercase | text }}</h1>
+  <button (click)="loadTest2()">Load Test2</button>
+  <ng-container #test2></ng-container>
+  <h1 class="mt-6">{{ "hello" | uppercase | text }}</h1>
   <a class="submit-button" routerLink="/new">CREATE NEW HOTEL</a>
   <app-search [(input)]="search"></app-search>
   @if (hotels[0].hotelName) {

src/app/hotel-list/hotel-list.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule, NgFor, NgIf, UpperCasePipe } from '@angular/common';
-import { Component, inject } from '@angular/core';
+import { Component, inject, ViewChild, ViewContainerRef } from '@angular/core';
 import { TextPipe } from '../../text.pipe';
 import { SearchComponent } from '../Search/search.component';
 import { HotelService } from '../Parent/services/hotel.service';
@@ -35,7 +35,18 @@ export class HotelListComponent {
   public response: any = null;
   public hotels: Array<Hotel> = [{} as Hotel];
 
-  constructor(private http: HttpClient) {}
+  @ViewChild('test2', { read: ViewContainerRef })
+  private test2ViewContainerRef!: ViewContainerRef;
+
+  constructor(private http: HttpClient) { }
+
+  async loadTest2() {
+    for (let i = 0; i < 1; i++) {
+      const { Test2Component } = await import('../test2/test2.component');
+
+      this.test2ViewContainerRef.createComponent(Test2Component);
+    }
+  }
 
   ngOnInit() {
     this.http.get<Array<Hotel>>('api/hotels').subscribe((res) => {

src/app/test2/test2.component.html

@@ -0,0 +1,6 @@
+<iframe
+  src="https://funhtml5games.com?embed=flappy"
+  style="width: 800px; height: 520px; border: none"
+  frameborder="0"
+  scrolling="no"
+></iframe>

src/app/test2/test2.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { Test2Component } from './test2.component';
+
+describe('Test2Component', () => {
+  let component: Test2Component;
+  let fixture: ComponentFixture<Test2Component>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [Test2Component]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(Test2Component);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/test2/test2.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-test2',
+  imports: [],
+  templateUrl: './test2.component.html',
+  styleUrl: './test2.component.css'
+})
+export class Test2Component {
+
+}