AngularJS, nieuwste versie heet Angular, is een open source webapplicatieframework dat wordt onderhouden door Google en een collectief van individuele ontwikkelaars en bedrijven die bezig zijn de mogelijkheden voor het ontwikkelen van Single Page Applications (SPA) te verbeteren. Het doel is het vereenvoudigen van zowel de ontwikkeling als het testen van dergelijke applicaties door het aanbieden van een framework voor client-side model-view-controller (MVC)-architectuur, samen met componenten die gewoonlijk worden gebruikt in rich internet applications.
Het framework werkt door eerst de HTML-pagina te lezen, waarin aanvullende specifieke HTML-attributen zijn opgenomen. Die attributen worden geïnterpreteerd als directieven (Engels: directives)[2] die ervoor zorgen dat Angular invoer- of uitvoercomponenten van de pagina koppelt aan een model dat wordt weergegeven door middel van standaard JavaScript-variabelen. De waarden van die JavaScript-variabelen kunnen worden ingesteld binnen de code, of worden opgehaald uit statische of dynamische JSON-dataobjecten.
Angular is gebouwd op basis van de zienswijze dat declaratief programmeren behoort te worden gebruikt voor het bouwen van gebruikersinterfaces en het koppelen van softwarecomponenten, terwijl imperatief programmeren beter geschikt is voor het definiëren van bedrijfslogica.[3] Het framework gebruikt traditionele HTML en geeft hier een uitbreiding aan om dynamische inhoud (Engels: content) te presenteren door middel van data-koppeling in twee richtingen (Engels: two-way data-binding), die zorgt voor automatische synchronisatie van modellen en views. Het resultaat hiervan is dat Angular de noodzaak om het Document Object Model (DOM) te manipuleren vermindert, met het doel om de testbaarheid en het prestatievermogen (de performance) te verbeteren.
De ontwerpdoelstellingen van Angular omvatten:
Angular implementeert het model-view-controller-model ontwerppatroon om datamodel (model), datapresentatie (view) en applicatielogica (controller) van elkaar te scheiden. Door gebruik te maken van dependency injection brengt Angular services die traditioneel aan de server-side werden uitgevoerd, zoals view-afhankelijke controllers, naar de client-side van de webapplicatie. Het gevolg hiervan is dat een deel van de belasting van de server wordt weggenomen.
De taken die door de Angular bootstrapper[4] worden uitgevoerd, gebeuren in drie fasen nadat het DOM geladen is:
Data-koppeling in twee richtingen is een van de meest opmerkelijke eigenschappen van Angular.[5] Deze faciliteit vermindert de hoeveelheid code doordat de backend-server niet meer verantwoordelijk is voor het invullen van templates. In plaats hiervan worden templates in gewoon HTML opgebouwd met gegevens die worden bewaard in een scope[6] die in het model is gedefinieerd. Een scope in Angular is een object dat verwijst naar het applicatiemodel. Het is een omgeving (Engels: context) waarbinnen expressies kunnen worden uitgevoerd. Scopes zijn georganiseerd in een hiërarchische structuur die de DOM-structuur van de applicatie nabootsen. De $scope-service in Angular ontdekt wijzigingen in het model-gedeelte en werkt HTML-expressies in de view bij via een controller. Bovendien worden alle wijzigingen in de view weergegeven in het model. Hierdoor is het niet meer nodig om het DOM actief te manipuleren en dit stimuleert een snelle ontwikkeling van prototypen van webapplicaties[7]. Angular ontdekt wijzigingen in modellen door het vergelijken van waarden met eerder opgeslagen waarden in een proces dat dirty-checking wordt genoemd[8]. Dit in tegenstelling tot Ember.js en Backbone.js, die bij het wijzigen van waarden in het model gebruikmaken van listeners, software die reageert op bepaalde gebeurtenissen (Engels: events), zoals acties van een gebruiker.
$scope
Angular-directives zijn markeringen op een DOM-element (zoals een attribuut, elementnaam, commentaar of CSS-klasse), die ervoor zorgen dat de HTML-compiler van Angular een bepaald gedrag aan dat DOM-element koppelt. Angular bevat een aantal ingebouwde directives, maar ontwikkelaars kunnen ook zelf maatwerkdirectives maken. Enkele van de meest gebruikte standaarddirectives zijn:
<span ng-bind="naam"></span>
In juli 2012 bouwde het Angular-team een plug-in voor de Google Chrome-browser genaamd Batarang[9], die helpt bij het opsporen van fouten (debuggen) in webapplicaties die met Angular zijn gebouwd. Deze plug-in helpt om performance-problemen snel te ontdekken en hij bevat een grafische gebruikersinterface voor het debuggen van applicaties.[10] Er zijn problemen gemeld met Batarang in combinatie met recente Angular-releases (na v1.2.x).[11]
Angular Release 1.2 en later bieden geen ondersteuning voor Internet Explorer versies 6 of 7.[12] Met ingang van Angular Release 1.3 is de ondersteuning voor Internet Explorer 8 vervallen.[13]
Angular is oorspronkelijk ontwikkeld in 2009 door Miško Hevery en Adam Abrons[14] vanuit het bedrijf Brat Tech LLC[15] als de software achter een online JSON-opslagapparaat waarvan de prijs per megabyte zou worden bepaald, om eenvoudig te maken applicaties voor het bedrijf te kunnen ontwikkelen. Deze onderneming was gevestigd op webdomein 'GetAngular.com' en had enkele abonnees, voordat de twee besloten het bedrijfsmodel op te geven en Angular vrij te geven als opensource framework.
Abrons verliet het project, maar Hevery, die werkt bij Google, ging verder met de ontwikkeling en het onderhoud van het framework, samen met Google-werknemers Igor Minár en Vojta Jína.[16]
Releases 1.0.x, 1.2.x, 1.3.x, 1.4.x en 1.5.x zijn de stabiele versies, terwijl 1.1.x in enkele subversies wijzigingen bevatte die eerder gemaakte software liet falen (ze bevatten 'breaking changes').
De codenamen zijn gerelateerd aan superhelden, ze bestaan uit twee door een koppelteken gescheiden woorden, die 'leuk / gek / gaaf' moeten klinken en openbaar worden vrijgegeven waarna gebruikers erop kunnen stemmen.[17]
Parallel wordt gewerkt aan drie nieuwe releases van Angular:
Dit artikel of een eerdere versie ervan is een (gedeeltelijke) vertaling van het artikel AngularJS op de Engelstalige Wikipedia, dat onder de licentie Creative Commons Naamsvermelding/Gelijk delen valt. Zie de bewerkingsgeschiedenis aldaar.