idk

src/app/app.component.spec.ts

@@ -1,31 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-import { AppComponent } from './app.component';
-
-describe('AppComponent', () => {
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AppComponent],
-    }).compileComponents();
-  });
-
-  it('should create the app', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
-    expect(app).toBeTruthy();
-  });
-
-  it(`should have the 'hotel-manager' title`, () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
-    expect(app.title).toEqual('hotel-manager');
-  });
-
-  it('should render title', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.querySelector('h1')?.textContent).toContain(
-      'Hello, hotel-manager',
-    );
-  });
-});

src/app/hotel/component/hotels.component.ts

@@ -1,4 +1,4 @@
-import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
+import {ChangeDetectionStrategy, Component, inject, ViewChild, ViewContainerRef} from '@angular/core';
 import {HotelComponent} from './hotel.component';
 import {Hotel} from '../model/hotel';
 import {FormsModule} from '@angular/forms';
@@ -38,6 +38,12 @@ import {StarComponent} from './star.component';
     } @empty {
       <h1>no matching results for {{ search }}</h1>
     }
+    <br>
+    <hr>
+    <br>
+    <button (click)="show()">asa</button>
+    <br>
+    <ng-container #example />
   `,
   imports: [
     FormsModule,
@@ -61,7 +67,18 @@ export class HotelsComponent {
 
   public matchingHotels: Observable<Hotel[]> = this.hotelService.getHotels();
 
+  @ViewChild('example', { read: ViewContainerRef })
+  private viewRef!: ViewContainerRef;
+
   public searchEvent(input: string) {
     this.search = input.toLowerCase();
   }
+
+  public async show() {
+    if (this.viewRef.length === 0) {
+      const {Test2Component} = await import('../../test2/test2.component');
+
+      this.viewRef.createComponent(Test2Component);
+    }
+  }
 }

src/app/test2/test2.component.ts

@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+import {range} from "rxjs";
+
+@Component({
+  selector: 'app-test2',
+  standalone: true,
+  imports: [],
+  template: `
+    <a href="https://simonis.lol" target="_blank">cool website</a>
+
+       
+  `
+})
+export class Test2Component {
+}