Wat is AngularJS?
AngularJS is een open source Model-View-Controller-framework dat vergelijkbaar is met het JavaScript-framework.
Angular JS is waarschijnlijk een van de meest populaire moderne webframeworks die tegenwoordig beschikbaar zijn. Dit framework wordt gebruikt voor het ontwikkelen van voornamelijk Single Page-applicaties. Dit framework is ontwikkeld door een groep ontwikkelaars van Google zelf.
Vanwege de pure steun van Google en ideeën van een breed communityforum, wordt het framework altijd up-to-date gehouden. Het bevat ook altijd de nieuwste ontwikkelingstrends in de markt.
In deze tutorial leer je-
- AngularJS-functies
- Angularjs-architectuur
- AngularJS Voordelen
AngularJS-functies
Angular heeft de volgende hoofdkenmerken waardoor het een van de krachtige frameworks op de markt is.
-
MVC - Het framework is gebouwd op het beroemde concept van MVC (Model-View-Controller). Dit is een ontwerppatroon dat in alle moderne webapplicaties wordt gebruikt. Dit patroon is gebaseerd op het splitsen van de bedrijfslogica-laag, de gegevenslaag en de presentatielaag in afzonderlijke secties. De indeling in verschillende secties is gedaan zodat ze allemaal gemakkelijker kunnen worden beheerd.
-
Gegevensmodelbinding - U hoeft geen speciale code te schrijven om gegevens aan de HTML-besturingselementen te binden. Dit kan door Angular worden gedaan door slechts een paar codefragmenten toe te voegen.
-
Minder code schrijven - Bij het uitvoeren van DOM-manipulatie moest er veel JavaScript worden geschreven om een applicatie te ontwerpen. Maar met Angular zul je versteld staan van de kleinere hoeveelheid code die je nodig hebt om te schrijven voor DOM-manipulatie.
-
Unit Testing gereed - De ontwerpers bij Google ontwikkelden niet alleen Angular, maar ontwikkelden ook een testraamwerk genaamd "Karma" dat helpt bij het ontwerpen van unit-tests voor AngularJS-applicaties.
AngularJS-architectuur
Angular.js volgt de MVC-architectuur, het diagram van het MVC-framework zoals hieronder weergegeven.
-
De controller vertegenwoordigt de laag met de bedrijfslogica. Gebruikersgebeurtenissen activeren de functies die in uw controller zijn opgeslagen. De gebruikersgebeurtenissen maken deel uit van de controller.
-
Weergaven worden gebruikt om de presentatielaag weer te geven die aan de eindgebruikers wordt aangeboden
-
Er worden modellen gebruikt om uw gegevens weer te geven. De gegevens in uw model kunnen zo simpel zijn als het hebben van primitieve declaraties. Als u bijvoorbeeld een studententoepassing onderhoudt, kan uw datamodel alleen een student-ID en een naam hebben. Of het kan ook complex zijn door een gestructureerd datamodel te hebben. Als u een autobezitstoepassing onderhoudt, kunt u structuren hebben om het voertuig zelf te definiëren in termen van motorvermogen, zitcapaciteit, enz.
AngularJS Voordelen
-
Omdat het een open source framework is, kunt u verwachten dat het aantal fouten of problemen minimaal is.
-
Tweerichtingsbinding - Angular.js houdt de gegevens- en presentatielaag gesynchroniseerd. U hoeft nu geen extra JavaScript-code te schrijven om de gegevens in uw HTML-code en uw gegevens later gesynchroniseerd te houden. Angular.js zal dit automatisch voor u doen. U hoeft alleen maar aan te geven welk besturingselement aan welk deel van uw model is gebonden.
-
Routing - Angular kan zorgen voor routing, wat betekent dat u van de ene weergave naar de andere gaat. Dit is het belangrijkste fundament van toepassingen met één pagina; waarin u op basis van gebruikersinteractie naar verschillende functionaliteiten in uw webapplicatie kunt gaan, maar toch op dezelfde pagina kunt blijven.
-
Angular ondersteunt testen, zowel unit-testen als integratietesten.
-
Het breidt HTML uit door zijn eigen elementen aan te bieden, directives genaamd. Op een hoog niveau zijn richtlijnen markeringen op een DOM-element (zoals een attribuut, elementnaam en commentaar of CSS-klasse) die de HTML-compiler van AngularJS vertellen om een bepaald gedrag aan dat DOM-element te koppelen. Deze richtlijnen helpen bij het uitbreiden van de functionaliteit van bestaande HTML-elementen om uw webtoepassing meer kracht te geven.