Kako ustvariti spustno polje s pomočjo Angular?



V tem blogu se naučimo, kako ustvariti preprosto spustno polje s pomočjo ogrodja Angular. Spustno polje je ustvarjeno z dvema edinstvenima metodama.

Učenje in izpopolnjevanje izvajanja nekaterih vsakdanjih opravil z uporabo programa Angular lahko precej hitro poveča vašo kariero, še posebej, če ste nov v . V tem članku bomo razpravljali o eni taki nalogi, ki jo je moral razvijalec opraviti tisoče časa: ustvariti skromno spustno polje. V tem blogu bodo obravnavane naslednje teme:

Kaj je kotni?


Kotni logotip - kotni MVC - edurekaNo, če berete blog o tem, kako narediti spustno polje s pomočjo programa Angular, lahko domnevamo, da že imate splošno predstavo o programu Angular. Za tiste, ki tega bloga niste in ste naleteli na splet zaradi muhavosti in domišljije interneta, je front-end razvojni okvir. Razvija in vzdržuje ga tehnološki velikan Google. Ponuja modularen način za razvoj spletnih strani z eno stranjo, kot so Gmail, PayPal in Lego. Aplikacije, zgrajene z uporabo programa Angular, izvajajo pristop Model-View-View-Model.





Kaj je spustno polje?

Rezultat slike za ikono spustnega menijaSpustno polje je čista metoda prikaza niza možnosti, saj je na začetku prikazana samo ena izbira, dokler uporabnik ne aktivira spustnega polja. Če želite na spletno stran dodati spustno polje, uporabite a izberite element ali a seznam-postavka . Za prvo oznako v izbranem elementu mora biti izbrana možnost nastavljena na vrednost izbranega. Tu je majhen delček kode, ki vam bo pokazal, kaj mislim.

java skript pojavno sporočilo
Možnost 1 Možnost 2 Možnost 3

Seveda bi zgornja koda potrebovala svoj poseben javascript, da bi pričakovala vedenje, vendar osnovni okvir spustnega menija ostaja enak. Poglejmo, kako to počnemo zdaj v Angularju.



Spustno polje Uporaba kota

Iskreno rečeno, bilo bi precej zastrašujoče prikazati vse možne načine za uporabo spustnega polja v kotni obliki. Možgani vsakega razvijalca logiko obdelujejo na svoj edinstven način in v svoji karieri sem videl nekaj norih spustnih menijev. Ponižen bom in vam pokazal precej osnovni pristop v spustnem meniju.

1. način: Izdelava spustnega seznama z uporabo ng-možnosti

Uporabite lahko ng-možnosti da ustvarite spustni meni iz polja ali seznama elementov.

kaj je anonimni tečaj v javi
var app = angular.module ('demo', []) app.controller ('myCtrl', function ($ scope) {$ scope.names = ['Demavand', 'Pradeep', 'Ashutosh']})

2. način: Izdelava spustnega seznama z uporabo ng-repeat

Kotni kot vsestranski , ima očitno več načinov za ustvarjanje osnovnega spustnega menija. Direktiva ng-repeat ponavlja blok kode HTML za vsak element v matriki, z njo lahko ustvarite možnosti na spustnem seznamu, vendar je bila direktiva ng-options narejena posebej za zapolnitev spustnega seznama z možnostmi in ima eno pomembno Prednost, tj. spustni meniji z možnostmi ng omogočajo, da je izbrana vrednost predmet, medtem ko morajo biti spustni meniji iz ng-repeat niz.



Ta odrezek kode izvaja isti seznam z uporabo ng-repeat

{{name}} var app = angular.module ('demo', []) app.controller ('myCtrl', function ($ scope) {$ scope.names = ['Demavand', 'Pradeep', 'Ashutosh' ]})

S tem pridemo do konca tega precej kratkega 'spustnega seznama z uporabo angular'. Upam, da imate zdaj idejo, kako bi lahko v svojem lastnem projektu izvedli spustni meni. Če dvomite o tem blogu, jih lahko objavite kot komentar v spodnjem oddelku za komentarje. Lahko tudi delite svoj kreativni način ustvarjanja spustnega polja.

kako narediti paket v javi

Če želite izvedeti več o ogrodju Angular, si oglejte naš ki prihaja z usposabljanjem pod vodstvom inštruktorjev v živo in izkušnjami iz resničnih projektov. Ta trening vam bo pomagal poglobljeno razumeti Angular in vam pomagal doseči obvladovanje predmeta.

Imate vprašanje za nas? Prosimo, omenite ga v oddelku za komentarje v 'Angular Dropdown' in se vam oglasim.