Tento článok je zrkadlovým článkom o strojovom preklade, kliknite sem pre prechod na pôvodný článok.

Pohľad: 15693|Odpoveď: 0

[Angular] Séria Angular 9 (3) podporuje dynamické komponentové udalosti

[Kopírovať odkaz]
Zverejnené 2. 6. 2020 17:20:01 | | | |
Recenzia predchádzajúcej časti

Dynamicky zaťažené komponenty série Angular 9 (1)
https://www.itsvse.com/thread-9238-1-1.html

Dynamické prenosové parametre pre sériu Angular 9 (2)
https://www.itsvse.com/thread-9245-1-1.html

Séria Angular 9 (3) podporuje dynamické komponentové udalosti
https://www.itsvse.com/thread-9246-1-1.html

Angular 9 Series (IV) Custom Pipe potrubia
https://www.itsvse.com/thread-9248-1-1.html

Angular 9 Series (V) formátuje formát sumy meny
https://www.itsvse.com/thread-9249-1-1.html


Tento článok vysvetľuje, že ak sa prihlásite na udalosti pre dynamické komponenty, vieme, že bežné komponenty môžu byť viazané (), ale čo ak viažete dynamicky vytvorené udalosti? A prijme parametre odovzdané komponentom.

Komponenty Modal1Component a Modal2Component sú komponenty, ktoré dynamicky vytvárame v hlavnom rozhraní.

Modifikujeme komponent Modal1Component, aby sme pridali vstupné pole a tlačidlo. Po kliknutí na tlačidlo podkomponentu sa hodnota vráti rodičovskej komponente a zobrazí sa na rozhraní rodičovskej komponenty.

Pozrime sa najprv na vizualizácie, nasledovne:




Kód súvisiaci s komponentom Modal1 (dynamicky vytváraný podkomponent)

modal1.component.html



modal1.component.ts



Index component (rodičovská komponenta) súvisiaci kód

index.component.html

index.component.ts



Ak je nahlásená chyba:

Nedá sa naviazať na 'ngModel', pretože to nie je známa vlastnosť 'vstupu'

Riešenie:

Pridajte nasledujúci kód do svojho app.module:




Teraz sa môžeme prihlásiť na udalosti pre dynamicky vytvárané komponenty.

Ak neberiete do úvahy hodnotu prijímajúcej podkomponenty, môžete tiež použiť HostListener na prijatie udalostí tejto podkomponenty a potom ich spracovať podľa názvu tlačidla.

Pridajte nasledujúci kód do rodičovskej komponenty index.component.ts:

Písmeno e tu označuje $event.target a ak viete, ako získať parametre udalosti, môžete tiež odpovedať na správu z tohto článku.



(Koniec)




Predchádzajúci:Dynamické prenosové parametre pre sériu Angular 9 (2)
Budúci:Systém publikovania článkov, kto vie písať
Vyhlásenie:
Všetok softvér, programovacie materiály alebo články publikované spoločnosťou Code Farmer Network slúžia len na vzdelávacie a výskumné účely; Vyššie uvedený obsah nesmie byť použitý na komerčné alebo nezákonné účely, inak nesú všetky následky používateľmi. Informácie na tejto stránke pochádzajú z internetu a spory o autorské práva s touto stránkou nesúvisia. Musíte úplne vymazať vyššie uvedený obsah zo svojho počítača do 24 hodín od stiahnutia. Ak sa vám program páči, podporte originálny softvér, zakúpte si registráciu a získajte lepšie originálne služby. Ak dôjde k akémukoľvek porušeniu, kontaktujte nás prosím e-mailom.

Mail To:help@itsvse.com