< Angular

Angular koncepció

Szerző: Sallai András

Copyright © Sallai András, 2021, 2023

Licenc: CC Attribution-Share Alike 4.0 International

Web: https://szit.hu

Koncepció

Az alapvető építőelemek a komponensek, amelyek Ng modulokba (NgModules) vannak rendezve. Minden komponens megvalósít egy nézetet.

A komponensek szolgáltatásokat (services) vehetnek igénybe, amelyek nem kapcsolódnak közvetlenül nézetekhez. A szolgáltatások befecskendezhetők (inject) komponensekbe függőségként. Így lesz a kód moduláris és újrafelhasználható.

A modulok, a komponensek és a szolgáltatások olyan osztályok, amelyek dekorátorokat használnak. A dekorátorok az osztályok számára metaadatokat szolgáltatnak, amik megmondják hogyan kell őket használni.

Az osztályok metaadat összetevői a nézetet egy sablonhoz (tamplate) társítják. A sablon egy közönséges HTML, amik Angular direktívákkal és adatkötésekkel vannak kombinálva, amelyek lehetővé teszik a HTML változtatását, megjelenítés előtt.

Az Angular router funkció segítségével navigációs útvonalakat határozhatunk meg a nézetek közötti váltáshoz.

Modulok

Az Angular modulok (NgModules) kiegészítik az ES2015 JavaScript modulokat.

Az Angular kódbázis modulokra osztása, újrafelhasználható részeket biztosít számunkra. A készülő alkalmazásban csak azokat direktívákat, szolgáltatásokat használjuk, amelyekre szükség van. Így csökken az alkalmazás mérete és javul a teljesítmény.

Minden alkalmazásnak van egy gyökérmodulja, jellemzően ennek neve: AppModule. Ez biztosítja az alkalmazás indítását.

Komponensek

A komponensek önállóan működő, újrafelhasználható részei az alkalmazásnak. A komponens tartalmaz HTML sablont, stílus leírást, logikát, tesztet és adatokat.

Az Angular alkalmazás alapértelmezetten tartalmaz egy root komponenst, amibe újabb komponenseket építhetünk. Minden komponens újabb komponenseket tartalmazhat.

Szolgáltatások

A szolgáltatások önálló osztályok, amelyek az alkalmazáslogika és az adatkezelés között biztosítanak kommunikációt. Használjuk adatszolgáltatásra, azonosításra, naplózásra és más kliensoldali műveletekre.

A szolgáltatások használják a @Injectable() dekorátort, így használatuk is injektálással történik.