ajout Fonction searchBar

This commit is contained in:
Romain Verger 2022-02-18 16:41:52 +01:00
parent 2a3390cbae
commit 3dcdbfb405
3 changed files with 32 additions and 31 deletions

View File

@ -1,4 +1,4 @@
<app-search-bar *ngIf="dontShow" ></app-search-bar>
<app-search-bar *ngIf="dontShow"></app-search-bar>
<app-nav-bar *ngIf="dontShow"></app-nav-bar>
<router-outlet></router-outlet>
<app-footer *ngIf="dontShow"></app-footer>

View File

@ -10,9 +10,6 @@ import { ApiBackService } from './services/api-back.service';
export class AppComponent {
title = 'simpleat';
dontShow: boolean = false;
searchParam: any;
listResto: any;
constructor(private router:Router, private apiBackService : ApiBackService){
this.router.events.subscribe(e=>{
@ -27,29 +24,8 @@ export class AppComponent {
}
})
this.searchParam = {
searchText : "",
filterText : "first"
}
}
ngOnInit(): void {
this.listResto = this.apiBackService.getRestaurants();
console.log(this.listResto)
}
// onSearchResto(searchText: string,) {
// this.searchParam.searchText = searchText;
// const rawData = this.apiBackService.getRestaurants();
// this.listResto = rawData.filter(resto =>
// resto.name.toLowerCase().includes(searchText.toLowerCase()))
// }
ngOnInit(): void { }
}

View File

@ -1,4 +1,6 @@
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { ApiBackService } from 'src/app/services/api-back.service';
@Component({
selector: 'app-search-bar',
@ -7,14 +9,37 @@ import { Component, EventEmitter, OnInit, Output } from '@angular/core';
})
export class SearchBarComponent implements OnInit {
@Output() searchText = new EventEmitter();
searchText = new EventEmitter();
listRestau: any [];
restauByName : any[];
constructor() {}
constructor(private apiBackService : ApiBackService, private route: Router, private activatedRoute: ActivatedRoute) {
ngOnInit(): void {}
this.listRestau = [];
this.restauByName = [];
}
ngOnInit(): void {
this.apiBackService.getRestaurants().subscribe((restaurants: any[]) => {
this.listRestau = restaurants;
});
console.log(this.listRestau);
}
onChangeInput(search :string) {
this.searchText.emit(search);
console.log(search);
// this.searchText.emit(search)
this.restauByName = this.listRestau;
this.restauByName = this.restauByName.filter((restau : any) =>
restau.nom.toLowerCase().includes(search.toLowerCase()));
console.log(this.restauByName);
this.apiBackService.setListRestau(this.restauByName, "filtres");
this.route.navigate(['restaurants']);
}
}