AngularJS - Unosi u obrascima

Upravljanje podacima obrasca

U web aplikacijama najprirodniji način za dobivanje korisničkih podataka je putem obrazaca, pomoću njih možemo stvoriti elemente koji hvataju tekst ili jednostavne potvrde poput potvrdnih okvira, ali sve se to može prevesti kao korisnički podaci, s njima možemo raditi različitu obradu.
U AngularJS Rad s tim ulazima podataka vrlo je jednostavan, jer zbog načina na koji je knjižnica dizajnirana, možemo pretvoriti dio ovih podataka koje primamo u radnje u našoj aplikaciji, bilo za izračun ili definiranje njezinog ponašanja.
U ovom odjeljku vidjet ćemo nešto više o tome kako rukovati unosom u obrasce pomoću AngularJS -a.
Kako radi?Način na koji možemo unijeti uniju između ulaznih elemenata i naše logike AngularJS je vrlo jednostavno, moramo koristiti nekretninu ng-model i sve će imati neku vrstu odnosa, pa se može manipulirati vrijednošću onoga što unosimo putem oblika AngularJS, ovo se može odnositi na unos teksta, radio tipke, potvrdni okvir itd.
Pogledajmo u nastavku mali primjer onoga što objašnjavamo:

Ono što se ovdje događa je da u okviru Naš kontrolor možemo manipulirati onim što korisnik radi u okvir za označavanje, onda ako ga korisnik označi, odmah ćemo primiti marker kao istinito i ako ga poništite, imat ćemo suprotan odgovor.
Možemo ići malo dalje i možemo krenuti Naš kontrolor da marker je označeno prema zadanim postavkama, a zatim kada korisnik prvi put vidi stranicu, potvrdni okvir će biti označen.
Dodajte radnje
Ali ne samo pri bilježenju podataka koje moramo zadržati, možemo i moramo uključiti radnje nakon što primimo ulazne podatke, u AngularJS Možemo pozvati funkcije i metode koje se izvršavaju u slučaju našeg ulaznog elementa, na primjer napravit ćemo mali kalkulator koji uzima procjenu ulaganja za preuzimanje, ono što ćemo učiniti je pomnožiti primljenu vrijednost s 10, ajmo vidjeti:
1- Prvo moramo uspostaviti HTML elemente koje ćemo koristiti, jer ćemo u prethodnom primjeru stvoriti kontroler i ulaz će biti dio našeg modela:

POVEĆAJTE

2- Vidimo da smo uveli novu nekretninu ng-promjena a poziv smo dodijelili funkciji koja se zove calculoInversion () To znači da će se svaki put kad se promijeni naše polje za unos pozvati funkcija, kao što vidimo da je nešto vrlo jednostavno.
3- Sada ćemo izgraditi kod pomoću AngularJS to će oživjeti ono što smo vidjeli:

4- Izrađujemo odgovarajući regulator, zatim označavamo početnu vrijednost modela, u ovom slučaju izjednačujemo ga s 0, to uključuje oba elementa Procijenjeni početni Što potrebno, tada stvaramo funkciju calculoInversion () Vidimo da to radimo u takozvanom opsegu našeg kontrolera, na taj način je povezan s našim elementom. S ovim bi naša aplikacija trebala raditi na osnovnoj razini.
Naravno da ovom primjeru nedostaje nekoliko provjera valjanosti i uzima se u obzir samo kada korisnik promijeni vrijednost unesenog teksta, ali služi kao uvod za uključivanje radnji u naše aplikacije napisane sa AngularJS.
Prethodnistranica 1 od 2Sljedeći