Diskuze: Angular 7 komunikace mezi komponentami.

Naučíme tě pracovat na home-office.

Zjistit více...

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity

Ladislav Niderle

Člen

Ladislav Niderle:6.6.2019 13:37

Ahoj, potřeboval bych poradit jak správně udělat tu činnost, že když něco uložím v jedné komponentě, tak ta nadřazující dostane informaci, že se něco děje a provede další požadovanou činnost, kterou určím v programu.

Zkusil jsem: Snažil jsem se použít metodu ngOnChange i ngDoCheck a zároveň mám k tomu servisu, kam si ukládám právě informaci o změně, ale nikde se mi nedaří to rozjet tak abych udělal ten správný refresh.

Chci docílit: Moje snaha je ta, že mám jednu stránku (komponenta) a ta v sobě obsahuje několik dalších komponent + vylistovaný seznam chyb na daný záznam. A já potřebuji zařídit když v jedné znořených komponent udělám akci, tak aby se mi ten seznam chyb znovu načetl a zobrail po novu.

Předem moc děkuji za radu.

Odpovědět

6.6.2019 13:37

dankrul.krul

Člen

dankrul.krul:6.6.2019 15:06

Jedním z řešení je komunikace skrze společnou service: https://jasonwatmore.com/…able-subject

Nahoru Odpovědět

6.6.2019 15:06

Petr Štechmüller

Tvůrce

Petr Štechmüller:6.6.2019 17:05

Ahoj, tohle bych si tak úplně přes service neřešil. Lepší by byla jednoduchá implementace observable-observer pomocí třídy EventEmitter. Uvedu na příkladu:

Mějme tedy dvě komponenty A, B. Komponenta A obsahuje komponentu B. Chceme tedy, abychom mohli nějak informovat komponentu A z komponenty B, aby provedla nějakou akci.

V komponentě B tedy vytvoříme na to EventEmitter, třeba typovaný na void:

export class BComponent {
    @Output() emitter:  = new EventEmitter<void>();
    ....
}

kdykoliv budeš chtít vyvolat změnu, zavoláš nad emitterem metodu emit().
To bychom měli generování události, teď ještě ukážu, jak se na to dá reagovat.

V HTML kódu komponenty A, kde používáš komponentu B jednoduše přidáš "handler" toho emitteru:

<app-b (emitter)="emitterHandler($event)" />

No a nakonec v TS souboru komponenty A přidáš metodu emitterHandler($event), která se postará o reakci. Tedy v tvém případě refreshseznamu chyb.

Akceptované řešení
+20 Zkušeností
+2,50 Kč

Nahoru Odpovědět

6.6.2019 17:05

Pokud spolu kód a komentář nekorespondují, budou patrně oba chybné

Ladislav Niderle

Člen

Ladislav Niderle:7.6.2019 4:21

ahoj, můžeš mi prosím ještě ukázat, jak v BComponent nastavím tu proměnou emitter? Děkuji

Nahoru Odpovědět

7.6.2019 4:21

Petr Štechmüller

Tvůrce

Petr Štechmüller:7.6.2019 4:47

Prostě vytvoříš její instancí jak jsem ukázal v předchozím příspěvku...

Nahoru Odpovědět

7.6.2019 4:47

Pokud spolu kód a komentář nekorespondují, budou patrně oba chybné

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 5 zpráv z 5.

Nejčastěji vyhledáváné

Diskuze: Angular 7 komunikace mezi komponentami.