Intro till AngularJS 1.x

AngularJS (, Angular 2, Angular 4)

AngularJS är ett ramverk för att underlätta utvecklingen av enkelsidiga webbapplikationer. Detta låter kanske lite statiskt, men i ramverket ingår stöd för att ex koppla sidan till olika vyer, smart uppdatering av data, filtrering på synbara fält osv. Intrycket blir att du går till en annan webadress vilket inte är fallet.

Man kan fråga sig varför jag fokuserar på AngularJS 1 då det numera även finns Angular 2 och Angular 4. Då vissa tillägg endast finns för version 1 och den dessutom fortfarande (augusti 2017) är oerhört populär (> 50%) användare så nöjer jag hittills med att studera denna version 1.

MVC

Nomalt finns det ett sk ”pattern” som kallas MVC (Model View Controller), men AngularJS är mer av Model View Whatever…

  • Model är själva datat som ska presenterat,
  • View är vyn, dvs den synbara webbsidan och slutligen
  • Whatever är allt övrigt; hantering av data, utseendefixar, innehållsfilter…

Med AngularJS ”direktiv” kan en HTML-utvecklare med basala Javascript -kunskaper skapa relativt kraftfulla funktioner. Andra ramverk (och ”bibliotek”) innebär även att du behöver kunna programmera i ex Java eller PHP.

Under ytan kan man dock i vissa lägen behöva ha en rejäl förståelse för hur AngularJS och Javascript samverkar. Det är en viss kunskapsplatå som behöver passeras innan man får en djupare förståelse för hur det hela kan fungera.

jQuery

Om man jämför med jQuery som är ett oerhört populärt bibliotek så ska man med AngularJS inte behöva gå ner på den lägsta DOM-nivån i HTMLen för handgriplig detaljhantering, mycket ska kunna hanteras likt HTML-taggar; jQuery kan även det se något kryptiskt ut, , men jämfört med standard DOM-programmering så blir ofta koden betydligt kortare och mer lättläst än den ”råa” Javascriptkoden.

Det finns en light-version av jQuery inbakat i AngularJS för de tillfällen där det är mycket svårt att finstyra enbart via AngularJS -direktiv.


AngularJS is a framework for facilitating the development of single web page applications. This may sound a little static, but the framework includes support to e.g. link the page to different views, smart update of data, visibility filtering, etc. The impression is that you go to another web page which is not the case.

One might ask why I focus on AngularJS 1, since there are now also Angular 2 and Angular 4. Since many add-ons are still only available for version 1 and in addition currently (August 2017) are extremely popular (> 50%) users, I’m using this version 1 so far.

MVC

There is a so-called ”pattern” called MVC (”Model View Controller”), but AngularJS is more of ”Model View Whatever”…

  • Model is the actual data to be presented,
  • View is the view, ie the visible web page and finally
  • Whatever is everything else; data management, appearance fixes, content filters…

With AngularJS ”directive” an HTML developer with basic Javascript knowledge can create relatively powerful features. Other frameworks (and ”libraries”) also mean that you need to be able to program in Java or PHP for example.

However, under certain conditions you may need to have a solid understanding of how AngularJS and Javascript interact. A certain knowledge level needs to be passed before you get a deeper understanding of how it all works.

jQuery

Compared to jQuery, which is an extremely popular library, AngularJS does not always have to go down to the lowest DOM level in the HTML for easy-to-use detail management, it’s rather more handled like new HTML tags; JQuery can also look somehow cryptic, but compared to standard DOM programming, the code often becomes shorter and easier to read than the ”raw” Javascript code.

There is a ”light” version of jQuery inbox in AngularJS for those occasions where it is very difficult to fine-tune only through the AngularJS directive.

 

Be First to Comment

Kommentera

E-postadressen publiceras inte. Obligatoriska fält är märkta *