Tämä artikkeli on konekäännöksen peiliartikkeli, klikkaa tästä siirtyäksesi alkuperäiseen artikkeliin.

Näkymä: 15693|Vastaus: 0

[Angular] Angular 9 -sarja (3) sisältää dynaamiset komponenttitapahtumat

[Kopioi linkki]
Julkaistu 2.6.2020 17.20.01 | | | |
Edellisen osion katsaus

Angular 9 -sarja (1) Dynaamisesti kuormitetut komponentit
https://www.itsvse.com/thread-9238-1-1.html

Angular 9 -sarjan (2) dynaamisen komponentin siirtoparametrin
https://www.itsvse.com/thread-9245-1-1.html

Angular 9 -sarja (3) sisältää dynaamiset komponenttitapahtumat
https://www.itsvse.com/thread-9246-1-1.html

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

Angular 9 Series (V) muotoilee summan valuuttamuodon
https://www.itsvse.com/thread-9249-1-1.html


Tässä artikkelissa selitetään, että jos tilaat tapahtumia dynaamisille komponenteille, tiedämme, että tavalliset komponentit voivat olla sidottuja () mutta entä jos sidot dynaamisesti luotuja tapahtumia? Ja hyväksy komponentin välittämät parametrit.

Modal1Component ja Modal2Component komponentit ovat komponentteja, jotka luomme dynaamisesti päärajapinnassa.

Muokkaamme Modal1Component-komponenttia lisäämällä syöttölaatikon ja painikkeen. Kun lapsikomponenttipainiketta painetaan, arvo välitetään takaisin vanhemmalle komponentille ja näytetään vanhemman komponentin käyttöliittymässä.

Katsotaanpa ensin renderöintiä seuraavasti:




Modal1-komponentti (dynaamisesti luotu alikomponentti) liittyvä koodi

modal1.component.html



modal1.component.ts



indeksikomponentti (vanhempikomponentti) liittyvä koodi

index.component.html

index.component.ts



Jos virhe raportoidaan:

Ei voi sitoutua 'ngModeliin', koska se ei ole tunnettu ominaisuus 'inputille'

Ratkaisu:

Lisää seuraava koodi app.module-tiedostoosi:




Voimme nyt tilata tapahtumia dynaamisesti luoduille komponenteille.

Jos et ota huomioon vastaanottavan alikomponentin arvoa, voit myös käyttää HostListeneria alikomponentin tapahtumien vastaanottamiseen ja käsitellä niitä painikkeen nimen mukaisesti.

Lisää seuraava koodi emokomponenttiin index.component.ts:

Tässä e viittaa $event.targetiin, ja jos tiedät, miten tapahtuman parametrit saadaan, voit myös vastata tämän artikkelin viestiin.



(Loppu)




Edellinen:Angular 9 -sarjan (2) dynaamisen komponentin siirtoparametrin
Seuraava:Artikkelien julkaisujärjestelmä, kuka osaa kirjoittaa
Vastuuvapauslauseke:
Kaikki Code Farmer Networkin julkaisemat ohjelmistot, ohjelmamateriaalit tai artikkelit ovat tarkoitettu vain oppimis- ja tutkimustarkoituksiin; Yllä mainittua sisältöä ei saa käyttää kaupallisiin tai laittomiin tarkoituksiin, muuten käyttäjät joutuvat kantamaan kaikki seuraukset. Tämän sivuston tiedot ovat peräisin internetistä, eikä tekijänoikeuskiistat liity tähän sivustoon. Sinun tulee poistaa yllä oleva sisältö kokonaan tietokoneeltasi 24 tunnin kuluessa lataamisesta. Jos pidät ohjelmasta, tue aitoa ohjelmistoa, osta rekisteröityminen ja hanki parempia aitoja palveluita. Jos rikkomuksia ilmenee, ota meihin yhteyttä sähköpostitse.

Mail To:help@itsvse.com