Wyszukanie i pokazanie danych - Angular

0

Cześć, pisze obecnie taką apke: https://github.com/Mateuszto/cars
Napotkałem problem z wyszukaniem samochodów po marce. Chciałbym na /form po clicku na button submit pokazywać wyszukane samochody, a w /cars pokazywać wszystkie samochody i obecnie robię to w ngOnInit. Do obu akcji chciałbym użyć jednego componentu, chyba, że lepiej utworzyć drugi (target-cars?) Doszedłem do momentu w którym wyszukiwało samochody tylko działało to na zasadzie: klikam search, przechodzę na /cars i wracam na /form w tym wypadku pokazywało wyszukane samochody. Macie jakieś pomysły na rozwiązanie tego problemu? Sam już wysiadam i nie wiem co mógłbym szczerze zrobić, dzięki za wszystkie odpowiedzi i podpowiedz ;)

1

Twój komponent Cars powinien przyjmować dane za pomocą @Input() i wtedy wpuszczasz tam pofiltrowane. Sprawdzasz czy dane są przekazywane przez parenta, jeśli nie to wczytujesz całość, jeśli tak, to masz dane pofiltrowane.

export class CarsComponent implements OnInit {

  @Input() carList: Car[] | undefined;
  constructor(private cars: CarsService) {}

  ngOnInit(): void {
    if(!this.carList)
      this.carList = this.cars.getCars();
  }
}

Kod w /form

<app-cars [carList]="filteredCars"></app-cars>

TS

export class FormComponent implements OnInit {
  model: Partial<Car> = {};
  brandList = this.cars.brandList;

  filteredCars: Car[] | undefined;

  constructor(private cars: CarsService) { }

  ngOnInit(): void {
    this.model.brand = 'Bmw';
  }

  search() {
    this.filteredCars = this.cars.getCars().filter(x => x.brand === this.model.brand);
  }
}

1 użytkowników online, w tym zalogowanych: 0, gości: 1