Érvek az AngularJS mellett

Az AngularJS napjaink egyik legsikeresebb javascript alapú keretrendszere. Segítségével viszonylag hamar tudunk gyors és dinamikus webes alkalmazásokat készíteni.

Érvek az AngularJS mellett

Az AngularJs egy nagyszerű javascript alapú keretrendszer, amely számos meggyőző funkcióval rendelkezik. Bemutatnám a legfontosabb jellemzőit, amelyek segítségével gyors és dinamikus webes alkalmazásokat készíthetünk.


Kétirányú adatkapcsolás

Ez az AngularJS leghasznosabb funkciója. A legtöbb template kezelő rendszer egyirányú adatkapcsolást (data binding) teszt lehetővé, de az AngularJS kétirányút. Az egyirányú adatkapcsolás lényege az, hogy a template és a modell komponensek egyesítésével jön létre a nézet. Hogy ez mit is jelent? Azt, hogy bizonyos adatok alapján a rendszer legenerálja a forráskódot a template segítségével. De mi van akkor, ha a model változik. Például van egy oldalunk, amiken megjelenítünk bizonyos elemet és szeretnénk köztük keresni. Akkor újra kell tölteni az oldalt vagy folyamatosan kezelnünk kell a változásokat. Az előbbi példánál maradva, írnunk kell egy scriptet, ami figyeli, hogy mit keresünk és alapján változtatja az elemeket. Ez egy idő után nagyon bonyolultá teheti a kódolást. Ekkor jön képbe az AngularJS, ami képes a nézetet változtatni az adatok alapján.


Telepítés


Látogassuk meg az angularjs.org weboldalt és töltsük le a legutolsó verziót. Választhatunk, hogy tömörített vagy az alap verziót szedjük le. Érdemes a tömörítettet leszedni, hogy gyorsabban tudjon vele a böngésző dolgozni. Ezután nincs más dolgunk, csak a header részbe behívni a letöltött fájlt.

Hogy is mükődik az AngularJS?


Legelőször lefordul a template, ami ki van egészítve a megfelelő Angularos direktívákkal. Ezeknek a direktíváknak a segítsével érhetjük el, hogy a modelben lévő változások egyből láthatóvá válnak a nézetben.

Például:

Templatekezelés

Az AngularJS templatekezelése nagyon egyszerű. Teljes mértékben követi a Html szabványt, csak kiegészíti a saját direktíváival. Szerencsére ezek a dírektívák elég egyértelműek.

Pár direktíva:

ng-app: Ezt az összes template-be bele kell illeszteni. Ezzel jelezzük, hogy Angular kifejezéseket fogunk használni.

ng-controller: Megadhatjuk, hogy melyik Controllert fogjuk használni.

ng-repeat: foreach ciklus helyett

ng-if: Egyszerű if szerkezethez

ng-view: Létrehoz egy tárolót, ahol a megfelelő nézetet lehet elhelyezni.

ng-include: Egyszerű if szerkezethez

Egy egyszerű példa:


MVC (modell-view-controller)


Mint minden mai keretrendszer, az AngularJS is ezt a felépítést használja. Itt a view réteget a html kód ajda, ami tartalmazza a saját direktíváit is. A model réteget a javascriptben lévő változók adják. A view rétegben lévő Angular direktívák kapcsolják össze a modellel. A Controller pedig a javascript függvények, amik gyakorlatilag a modellt képező változókkal kapcsolatos műveleteket végzik.


Controller


AngularJS-ben a controllerek javascript nyelvben íródnak. A controllerek segítségével vezérelhetjük az alkalmazásunkat. Egy alkalmazáshoz az ng-controller dirketívával tudjuk meghatározni, hogy melyik controllert csatoljuk hozzá. Hozzácsatolás után létrejön a megfelelő kontrollerből egy új példány. A kontroller segítségével tudjuk vezérelni a változókat.

Példakód (html):

Példakód (js):


Persze a fentiek mellett még nagyon sok hasznos dolgot tud az AngularJS. Hamarosan jelentkezek majd további hasznos tudnivalókkal.




Kérem értékelje a cikket! (1-től 5-ig)

Jelenleg: 5 / 5 (9 szavazat)

Köszönöm a szavazatod.
Már értékelte ezt a cikket.

Nincs hozzászólás a(z) Érvek az AngularJS mellett bejegyzéshez
Szóljon hozzá, reagáljon Ön is
Köszönöm a hozzászólását. Jóváhagyás után megjelenik majd az oldalon.
Név mező kitöltése kötelező

Üzenet mező kitöltése kötelező