Good day!
I am developing a practice UI code in Angular 17 but getting error upon ng serve
for the entire project:
NG9: Property 'roomsCatalog' does not exist on type 'RoomsCatalogComponent'.
Project code can be found here GitHub repo link and path for the mentioned file is my-workspaceprojectsnew-hotel-inventorysrcapproomsrooms-catalogrooms-catalog.component.ts
The rooms-catalog.component.ts file is:
import { Component, Input, OnInit } from '@angular/core';
import { RoomDetails } from '../rooms';
@Component({
selector: 'app-rooms-catalog',
templateUrl: './rooms-catalog.component.html',
styleUrl: './rooms-catalog.component.scss'
})
export class RoomsCatalogComponent implements OnInit{
@Input() roomsCatalog: RoomDetails[]=[];
constructor(){}
ngOnInit(): void {}
}
The rooms.ts file imported into rooms-catalog.component.ts file is:
export interface RoomCount{
totalRooms : number;
availableRooms : number;
bookedRooms : number;
}
export interface RoomDetails {
roomType : string;
roomNumbers : number;
amenities : string;
price : number;
photos : string;
checkinTime : Date;
checkoutTime : Date
}
Also the rooms-catalog.component.html file is:
<table class="table">
<tr>
<th>Index</th>
<th>Even/Odd</th>
<th>Room Type</th>
<th>Number of rooms</th>
<th>Room Amenities</th>
<th>Checkin Time</th>
<th>Checkout Time</th>
<th>Room Price</th>
</tr>
<tr *ngFor="let room of roomsCatalog; let e = even; let o = odd; let i=index;"
[ngClass]="e? 'odd' : 'even'">
<th>{{i+1}}</th>
<th>{{e? "Odd" : "Even"}}</th>
<th>{{room.roomType}}</th>
<th>{{room.roomNumbers}}</th>
<th>{{room.amenities}}</th>
<th>{{room.checkinTime | date}}</th>
<th>{{room.checkoutTime | date}}</th>
<th>{{room.price}}</th>
</tr>
</table>
Would appreciate any help in this regard!
Many thanks in advance
Tried checking the error online but got no help. Confused as roomsCatalog
is present as a property in the exported class RoomsCatalogComponent