Problem with angular showing adverts by category

I have symfony5/angular10 project, in angular three components: categories (which I use to create a menu – simple list of categories), adverts (list all adverts), single advert (shows advert by id).

Based on these components in app-routing I got three routes:

{ path: 'adverts', component: AdvertsComponent },
{ path: 'advert/category/:name', component: AdvertsComponent },
{ path: 'advert/:id', component: AdvertSingleComponent },

First and last route work fine, I can list all ads and show single ad, but am unable to list ads by category – I get same result as when listing all ads (network inspector shows the same route is being hit).
I checked my api with Postman so I know all three routes work fine, so I guess the problem is with my angular code.

I suspect adverts component

import { Component, OnInit } from '@angular/core';
import { DatePipe } from '@angular/common';

import { Advert } from '../advert';
import { AdvertService } from '../advert.service';

@Component({
    selector: 'app-adverts',
    templateUrl: './adverts.component.html',
    styleUrls: ['./adverts.component.css']
})
export class AdvertsComponent implements OnInit {

    adverts: Advert[];

    constructor(private advertService: AdvertService, public datepipe: DatePipe) {}

    ngOnInit() {
        this.getAdverts();
    }

    getAdverts(): void {
        this.advertService.getAdverts()
        .subscribe(adverts => this.adverts = adverts);
    }

    getAdvertsByCategory(name): Advert {
        return this.adverts.find(advert => advert.category === name);
    }

}

As you can see ngOnInit has only getAdverts method, if I add getAdvertsByCategory there, in the console I get this.adverts is undefined.

Any clues?

Source: Symfony Questions

Was this helpful?

0 / 0

#angular #api #symfony