Cuprins
Când lucrăm la construirea aplicațiilor cu o singură pagină, unul dintre punctele pe care le putem evidenția este introducerea datelor, acest tip de funcționalitate se face de obicei cu utilizarea unui formăEvident, dacă vom solicita date de la un utilizator, trebuie să confirmăm că acestea nu vin cu erori.din fericire AngularJS Are câteva mecanisme interne care ne permit să facem validări într-un mod simplu, permițând astfel formularul să fie trimis numai atunci când sunt îndeplinite condițiile de formatare a datelor.
Primul lucru de care vom avea nevoie este un formă, vom plasa câteva câmpuri, de exemplu numele, prenumele și un câmp de e-mail, în general, acestea sunt cele mai utilizate tipuri de câmpuri și care ne vor oferi posibilitatea de a genera validări. Să vedem codul inițial pe care îl avem:
Nume:Nume:E-mail:Vârstă:Trimite
Dacă ne uităm, am folosit caracteristici ale HTML pentru a valida câmpurile, de exemplu prin plasarea proprietății necesar pentru câmpurile obligatorii, ei vor crede că acest lucru va funcționa numai în browsere mai noi sau compatibile HTML5 numai, dar când folosim AngularJS, aceasta va completa validările alternative dacă deschidem aplicația într-un browser care nu este compatibil cu HTML5.
Vedem că câmpul de vârstă are, în afară de validarea tipului, două proprietăți ale AngularJS care sunt pentru lungimea câmpului, aceasta înseamnă că putem plasa numai numere între 1 și 3 cifre în total.
Până acum mergem bine cu exercițiul nostru, totuși trebuie să validăm totuși că pentru a trimite datele totul trebuie validat, pentru aceasta trebuie să generăm un controler care să ne permită să facem acest lucru, pentru aceasta vom indica formularului care controlerul va folosi, pentru a schimba linia:
Prin următoarele:
În interiorul controlerului putem accesa o proprietate numită $ valabil, care este cel care va indica dacă formularul nostru este valid pentru a putea trimite datele, pentru aceasta trebuie să modificăm linia butonului de trimitere a datelor cu următoarele:
Trimite
Efectuarea modificării ar trebui să fie după cum urmează:
Trimite
În cele din urmă ne putem crea controlerul în AngularJS cu care vom procesa datele noastre:
funcție AddControllerUser ($ scope) {$ scope.message = ""; $ scope.addUser = function () {$ scope.message = 'Mulțumesc,' + $ scope.user.name + ', a fost adăugat!'; }; } Acest lucru ar trebui să ne ofere un rezultat cum ar fi următorul în browserul nostru:
