[Angular] pobieranie danych z API przez komponent podrzędny (child component)

0

Witam.
Zatrzymałem się na pewnym problemie i nie wiem czy jego rozwiązanie jest dobre. Korzystam z Angular Material. Zrobiłem child component, który wyświetla listę towarów. Oprócz samej tabeli z towarami są jeszcze opcje filtracji. Dane przychodzą z komponentu nadrzędnego. Nie bardzo wiem jak to zobrazować, ponieważ kodu html oraz ts jest sporo.

W ProductsComponent - nadrzędny, parent - wstawiam komponent z tabelą oraz przypisuje mu dane z API.

<app-products-table [data]="products"></app-products-table>

W komponencie z tabelą mam filtry: Rodzaj, Status, Magazyn oraz możliwość sortowania danych. Z każdym kliknięciem elementu, który zmienia dane wynikowe muszę przesłać informację do parenta, aby ten te dane pobrał z API w odpowiedniej formie i wysłał do komponentu z tabelą. Czy nie prościej było by, aby to komponent dziecko pobierało dane z API? Czy to ma jakiś kolosalny wpływ na pracę systemu? Wydaje mi się, że ta komunikacja parent <--> child jest tutaj niepotrzebna. Nie ukrywam, że tego komponentu z tabelą użyłbym też przy dodawaniu pozycji do zamówienia, więc te filtry się przydadzą.

Angular ver. 9, backend w ASP NET Core

1

Moim zdaniem, jeżeli dane dotyczą tylko komponentu podrzędnego to jak najbardziej w tym miejscu powinniśmy reagować na zmiany i pobierać dane - no bo w sumie po co je pobierać i trzymać poziom wyżej, skoro je tylko przekazujemy do childa?
Sam sobie odpowiedziałeś na pytanie :P

0

tak, dużo lepszym wyjściem jest zmykać to co jest od childa w childzie a dawać parentowi i pobierać z niego tylko to co rzeczywiście musi być w ten sposób zrobione.

0

Chyba spodziewałem się eseju na temat "dobrych praktyk". Jakoś mi to nie pasowało z tym przekazywaniem z nadrzędnego, ale nie byłem pewny. Widziałem też filmik z jakieś konferencji na YouTube, w którym gość rozkładał wszystko na komponenty i to znacznie wpłynęło na wydajność całej aplikacji (nie umiem tego znaleźć, to już dawno było). Ja się też nie wczytuje w dokumentację i pewne rzeczy robię "na pałę", a to tylko zmierza do robienia czegoś źle.

1

Nawet na chłopski rozum, to jest przekazywanie danych dla samego przekazywania, bez sensu - nie jest to zbyt "wydajne". Chociaż to bardziej właśnie "dobra praktyka" niż "znaczący wzrost wydajności".

1

to jest js tutaj nie debatujemy miesiącami jak napisać jedną klase :D

0

No wiec tak:
Jesli chodzi o dobre praktyki to z założenia powinieneś tworzyć komponenty do wielokrotnego wykorzystania. Jeśli zaszyjesz komunikacie z backendem w takim komponencie to ryzykujesz, ze wykorzystując ten komponent w innym miejscu nie wyświetlić już w nim innych danych. Poza tym ciężej w takim wypadku korzystać z jakiś mechanizmów cacheowania danych, bo są one zazwyczaj na wyższym poziomie. Ogólnie nie polecam takiego podejścia. Rób małe komponenty z inputami, napisz pod to testy, ustawa ChangeDetection na OnPush i masz komponent który możesz wykorzystać w każdym miejscu aplikacji.

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