Siemanko!
Mam chwilę aby podzielić się z wami podstawami o AngularJS, którego mam nadzieje zacznie używać więcej ludzi w Polsce ![]()
Link do strony domowej: https://angularjs.org/
AngularJS to JavaScriptowski framework MVW, wypluty przez google, który jest dość łatwy w uzyciu, bardzo szybko wykonamy rzeczy, które w czystym JS zajmują o wiele więcej czasu i posiada on bardzo dużo plusów na tle pozostałych z tej kategorii.
Dobra, pierwsze co to zacznijmy od 'zainstalowania' biblioteki. Stwórzmy prosty dokument z dodanym frameworkiem:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Mój pierwszy skrypt!</title>
<script src="https://code.angularjs.org/1.2.19/angular.min.js"></script>
</head>
<body>
// document body here!
</body>
</html>
Jesli mamy już stworzony plik, który zawiera plik z AngularJS, teraz czas na wykonanie kilku prostych poleceń, które 'ożywią' nasz dokument!
Piwersze z nich to dodanie 'ng-app' jako wbudowanej dyrektywy, która definiuje naszą aplikacje. Wszystko pomiędzy tą dyrektywą co związane jest z Angularem, będzie brane pod uwagę przy wykonywaniu skryptu ![]()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Mój pierwszy skrypt!</title>
<script src="https://code.angularjs.org/1.2.19/angular.min.js"></script>
</head>
<body>
<div ng-app>
<input type="text" ng-model="q">
<span>{{q}}</span>
</div>
</body>
</html>
Tutaj mamy do czynienia także z wbudowaną dyrektywą jaką jest ng-model. Generalnie prefiks 'ng' jest zarezerwowany dla wbudowanych dyrektyw w tym frameworków.
ng-model definiuje model danych, które są sprawdzane pod kątem zmian oraz przetwarzane w tym frameworku. Działanie to jest trawione w definicji zwanej digest cycle ale o tym troszkę później. ng-model można określić jako model danych wysyłanych do rdzenia frameworka
Czyli jak wpiszemy w pole tkstowe tekst, Angular przetrawi go i zwróci wynik końcowy natychmiast.
Jak widać, użyłem także tagów {{ }} typowych dla AngularJS, pomiędzy nim, w prostszy sposó (co nie znaczy że najlepszy) definiujemy naszą treść, którą Angular wypluje - dobrym porównaniem jest 'echo' w PHP.
Tutaj można zobaczyć proste demo: http://jsfiddle.net/5Tb88/
Czyż nie jest łatwe ? Jest. Jednakże to jest początek góry lodowej, która czeka nas do wyuczenia, jeśli chcemy oczywiście cokolwiek tworzyć w tym frameworku.
To są akurat podstawy podstaw, opisane moimi słowami, myślę że to taki przedsmak tego co opiszę w następnych tematach. Chciałbym je rozdzielić na więcej i mniejszych tematów, ponieważ z doświadczenia wiem, że z tym co za dużo to i nie zdrowo.
Także nie długo kolejna część, bardziej treściwa na temat ogólnie dyrektyw, wbudowanych dyrektyw w AngularJS oraz stworzymy jakiś prosty skrypcik, który będzie korzystał z ich mocy ![]()
Tymczasem zachęcam do czytania przede wszytskim dokumentacji i powodzenia w nacue tym, którzy są zainteresowani w tym temace ![]()














