import { Component, OnInit } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { IonicModule } from '@ionic/angular'; import { HomePage } from '../home/home.page'; interface Restaurant { name: string; dish: string; rating: number; distance: string; price: number; image: string; topDish: string; } @Component({ selector: 'app-search', templateUrl: './search.page.html', styleUrls: ['./search.page.scss'], standalone: true, imports: [IonicModule, CommonModule, FormsModule], providers:[HomePage] }) export class SearchPage implements OnInit { searchTerm!: ''; searchResults: Restaurant[] = []; ngOnInit() { } constructor( private homePage: HomePage) { } // Filters the restaurant list based on the user's search term for name, dish, rating, and distance. searchRestaurants() { if (this.searchTerm.length > 0) { this.searchResults = this.homePage.restaurantList.filter((restaurant) => restaurant.name.toLowerCase().includes(this.searchTerm.toLowerCase()) || restaurant.dish.toLowerCase().includes(this.searchTerm.toLowerCase()) || restaurant.topDish.toLowerCase().includes(this.searchTerm.toLowerCase()) || (restaurant.rating >= parseInt(this.searchTerm) && restaurant.rating < parseInt(this.searchTerm) + 1) ) } else { this.searchResults = []; }; }; addToCart(restaurant:any){ this.homePage.addToCart(restaurant); } }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter