still dont know

src/app/hotel/hotels.component.ts

@@ -0,0 +1,64 @@
+import {Component} from "@angular/core";
+import {NgFor, NgIf} from "@angular/common";
+import {HotelComponent} from "./hotel.component";
+import {Hotel} from "./hotel";
+import {FormsModule} from "@angular/forms";
+
+@Component({
+  standalone: true,
+  template: `
+    <form>
+      <input name="search" [ngModel]="search" (ngModelChange)="searchEvent($event)">
+    </form>
+    <ng-container *ngFor="let hotel of hotels">
+      <div *ngIf="search === '' || hotel.hotelName.toLowerCase().includes(search)">
+        <app-hotel [hotel]="hotel"></app-hotel>
+        <hr>
+      </div>
+    </ng-container>
+  `,
+  imports: [NgFor, NgIf, FormsModule, HotelComponent],
+  selector: 'app-hotels'
+})
+export class HotelsComponent {
+  public search: string = ''
+
+  public searchEvent(input: string) {
+    this.search = input.toLowerCase();
+  }
+
+  hotels: Hotel[] = [
+    {
+      "hotelId": 1,
+      "hotelName": "Buea süßes Leben",
+      "description": "Schöne Aussicht am Meer",
+      "price": 230.5,
+      "imageUrl": "assets/img/heisenberg.jpg",
+      "rating": 3.5
+    },
+    {
+      "hotelId": 2,
+      "hotelName": "Marrakesch",
+      "description": "Genießen Sie den Blick auf die Berge",
+      "price": 145.5,
+      "imageUrl": "assets/img/kjan.png",
+      "rating": 5
+    },
+    {
+      "hotelId": 3,
+      "hotelName": "Abuja neuer Palast",
+      "description": "Kompletter Aufenthalt mit Autoservice",
+      "price": 120.12,
+      "imageUrl": "assets/img/huy.png",
+      "rating": 4
+    },
+    {
+      "hotelId": 4,
+      "hotelName": "OUR Hotel",
+      "description": "Wunderschönes Ambiente für Ihren Aufenthalt",
+      "price": 135.12,
+      "imageUrl": "assets/img/rat.png",
+      "rating": 2.5
+    }
+  ]
+}