Co to jest?
Angular jest to projekt open-source stworzny przez Google jako JavaScriptowy framework. Jak mówi wikipedia: „wspiera on tworzenie i rozwijanie aplikacji internetowych na pojedynczej stronie”. Biblioteka używa wzorca Model-View-Controller (MVC) aby ułatwić rozwój i testowanie aplikacji internetowych. Biblioteka posiada specjalne znaczniki którę wczytywane są z plikiem HTML przez którę następują akcję z plików angulara napisanych w JavaScripc. W angular.js występuje dwukierunkowe wiązanie danych (two-way binding) czyli kiedy w modelu następuje zmiana widok zostaje od razu zaktualizowany oraz kiedy następuje zmiana w widoku zmiana natychmiastowo wysyłana jest do modelu.
Pierwszy program
Aby utworzyć aplikacje z użyciem Angular.js należy dodać bibliotekę do pliku HTML oraz użyć wbudowanych tagów angulara przeznaczonych dla pliku HTML.
Pierwsza aplikacja z Angular
Pierwsze wyrażenie w angular: {{ 1 + 2 }}
Wynikiem powyższego kodu jest:
Pierwsze wyrażenie w angular: 3
Jak to działa?
Aby uruchomić Angular.js musimy dodać bibliotekę do naszego pliku HTML oraz wstawić specjalny tag angularowy do HTML mianowicie mowa o dyrektywie ng-app. Aby można było używać angulara musimy w aplikcji dodać tag ng-app od teraz wszystkie operacje angulara muszą być potomkami dyrektywy ng-app, ng-app musi być rodzicem.
Dodanie dyrektywy ng-app mówi tyle, że „Angularze wykonaj swoją magię”. Wyrażenie {{ 1 + 2 }} jest ocenione przez Angular i wyrenderuje wynik 3.
Użycie angularowej dyrektywy po za ng-app spowoduję, że zadziała jako zwykły tag HTML bez użycia Angular.js. Usunięcie dyrektywy ng-app spowoduję, że aplikacja wyświetli wszystko tylko jako tagi HTML, bez użycia Angular.js.
Pierwsze wyrażenie w angular: {{ 1 + 2 }}
Wynikiem operacji będzie:
Pierwsze wyrażenie w angular: {{ 1 + 2 }}
Na pierwszy wpis z Angularem.js (pierwszym) to tylę, w następnych wpisach poruszymy więcej zagadnień.
Pozdro 🙂