Cele două aspecte principale din AngularJS, care pot induce în eroare și este de $ $ aplică Digest. Scopul acestui articol încerca să explice ce această funcție și modul în care acestea pot fi utile în AngularJS programare de zi cu zi.
Examinăm aplica $ si $ digest
După cum se știe, angularjs are o oportunitate incredibilă în fața a două căi de legare a datelor și de prezentare, în mod repetat, ceea ce face viața noastră cu tine. Acest lucru înseamnă că, atunci când schimbați ceva pe pagina, iar modelul de date este actualizat domeniul de aplicare automagic. Prin urmare, atunci când primul model de date pentru domeniul de aplicare se schimbă, și să prezinte pentru a schimba pagina. AngularJS Cum se face?
Când scrieți o expresie (>), a pus AngularJS în liniște de urmărire caracteristică (Watcher), care actualizează ecranul atunci când modificați modelul. Urmărirea în același mod exact vă puteți scrie în domeniul de aplicare.
Al doilea argument a trecut să funcționeze ascultător (ascultător), care se numește de fiecare dată când valoarea schimbă aModel.
Este ușor de înțeles că, atunci când valoarea modelului modificărilor, ascultătorul este declanșată prin actualizarea expresiei în HTML. Dar există încă o mare întrebare! După cum AngularJS înțelege că trebuie să apelați funcția ascultător? Cu alte cuvinte, deoarece AngularJS știu că modelul sa schimbat, apoi pentru a determina funcția de ascultător? Poate începe cu această funcție, care este periodic pentru a verifica modificările valorilor domeniului de aplicare model. Aici intră în ciclul de funcționare $ Digest.
În timpul acestui ciclu a început funcția de urmărire. După aceea AngularJS calculează valoarea modelului, iar în cazul în care sa schimbat, atunci funcția de ascultător corespunzător este declanșat. Următoarea întrebare este - când și în cazul în care ciclul începe $ digera?
El conduce după apelul la $ domeniul de aplicare. $ Digest (). Să presupunem că modificați modelul domeniului de aplicare prin presare Directiva funcție de procesare
ng clic. În acest caz, ciclul începe automat AngularJS $ Digest. Și după lansarea funcțiilor activate în fiecare piesă. Aceste funcții verifica valoarea curentă a modelului, comparativ cu valoarea calculată. În cazul în care acestea sunt diferite, atunci funcția corespunzătoare este efectuată de către ascultător. Ca rezultat al tuturor expresiilor pentru a actualiza pagina. În plus față de ng-clic, există mai multe linii directoare / servicii care vă permit să schimbați modelul și automat începe bucla Digest $. (Ng-model. $ Timeout).
Până acum, totul pare clar, dar există puține nuanță. AngularJS $ determină digest direct, în loc să-l folosește domeniul de aplicare $. $ Aplicare (). care, la rândul său, determină $ rootScope. $ Digest (). Ca urmare, se evită în mod constant orice domeniu de aplicare copil și determină caracteristicile de urmărire pentru toată lumea.
Imaginați-vă că ați agățat ng-clic pe butonul și directiva prescrisă pentru funcția ei. Când apăsați butonul, AngularJS se va încheia funcție în domeniul de aplicare $. $ Aplicare (). Ie funcția va rula ca de obicei, va actualiza modelul (dacă este necesar) și apoi au digestul rula $ bucla pentru a schimba este afișată pe pagină.
Notă. $ Domeniu de aplicare. $ Apply () pornește automat $ rootScope. $ Digest (). Funcția $ aplică () are doi constructori. Originea - funcția primește ca argument, executa-l, și apoi se execută $ digera ciclu. Al doilea - nu acceptă argumentele și pur și simplu rulează $ ciclul Digest. Mai târziu vom vedea de ce varianta a argumentului mai bine.
Când aveți nevoie pentru a apela $ aplica () în codul?
Dacă AngularJS înveliți codul nostru în $ se aplică () și începe ciclul de $ Digest. în orice caz, trebuie să ne numim aplica $ în codul? AngularJS este foarte simplu în acest moment. Modelul se schimbă numai în contextul AngularJS. Ie Codul care schimbă modelul interior, înfășurat aplică $ (). Directivele AngularJS construite fac deja, astfel încât orice modificări ale modelului sunt reflectate în pagina. Fie că nu a fost, dacă schimbați modelul în afara angularjs context, va trebui să informeze angularjs cu privire la aceste modificări prin apelarea aplica $ () în codul, și începe deja funcția de urmărire și modificările vor avea în mod corect în vigoare.
De exemplu, dacă utilizați funcția JS setTimeout () pentru a actualiza domeniul de aplicare al modelelor. AngularJS nu știe despre schimbarea. În acest caz, responsabilitatea pentru notificarea AngularJS pe umeri și aveți codul pentru a apela $ aplica (). care a lansat deja un ciclu Digest $.
De asemenea, dacă aveți propria directivă, care a pus pe diferite ascultătorii eveniment DOM și de a schimba unele modele în cadrul handler, aveți nevoie pentru a apela $ aplica () pentru a fi siguri ca modificările să aibă efect.
Să ne uităm la un exemplu. Implicația este că aveți o pagină pe care doriți să afișeze mesaje pe ea, cu o întârziere de 2 secunde. Punerea în aplicare va fi similară cu următoarea:
Începe exemplul de actualizare, veți vedea pagina de actualizare în 2 secunde. Singura modificare în codul din exemplul anterior pe care le-am înfășurat codul în domeniul de aplicare $. $ Aplicare (). care se lansează automat $ rootScope. $ digera (). Ca urmare, funcția de urmărire va porni și modelul de valoare necesară încărcarea paginii.
Notă. Încercați să utilizați întotdeauna timeout-ul de serviciu $. ori de câte ori este posibil, care este aceeași ca setTimeout (). care se transformă automat în $ sunt valabile în cazul și nu trebuie să se bazeze pe ea în codul.
De asemenea, rețineți că codul exemplu de mai jos, modelul este actualizat ca de obicei, dar în cele din urmă se aplică utilizat $ () fără argumente.
Această versiune a metodei utilizează domeniul de aplicare $. Aplicare $ () fără argumente, dar încă funcționează codul. Dar, amintiți-vă că ar trebui să utilizați întotdeauna $) aplică argumente (. Acest lucru se datorează faptului că funcția este transmisă ca argument este o încercați chiar bloc. captură, și în cazul în care are loc o excepție, va trece prin serviciul de la exceptionHandler $
De câte ori au declanșat un ciclu de $ Digest?
În cazul în care ciclul este pornit pentru a digera, funcțiile de urmărire sunt efectuate pentru a verifica dacă modelul se schimbă în domeniul de aplicare. În cazul în care sa schimbat, atunci sunt pornite ascultătorii de funcții corespunzătoare. Acest lucru duce la o întrebare importantă. Și dacă ascultătorul se schimbă, de asemenea, modelul? Așa cum AngularJs reacționează la acest lucru?
Răspunsul este că ciclul Digest $-unul lansare nu este limitat. La sfârșitul ciclului curent, începe din nou pentru a verifica dacă modelul de schimbare. În principiu, acest „murdar de verificare» (verificare murdar) și este de a urmări modificări care ar fi avut loc în ascultători. Prin urmare, ciclul începe din când în când, până la sfârșitul modelului sau schimba-l atinge numărul maxim de iterații - 10. Deci, este întotdeauna bine să fie idempotente și să încerce să reducă la minimum schimbarea în funcția de model de ascultători.
Notă. $ Buclă digest rula cel puțin 2 ori, în cazul în care nu există nici o schimbare în tiparele funcțiilor elevilor. Așa cum este descris mai sus, începe peste tot din nou pentru a vă asigura că valoarea modelului este stabilă și nu există nici o schimbare.