AngularJS 2: Výrazy
Jsem nadšený (a přiznejme si v mnohém nezkušený) programátor, grafik a student - právě proto se rád učím a doufám, že tato vášeň mě jen tak neopustí. Tvořím webové stránky pro podnikatele a menší firmy - zejména z lékařského prostředí.
Některé z mých projektů:
Webové stránky tvořím ve Wordpressu, front-endová prostředí programuji v JS, upravuji pomocí HTML, CSS a Bootstrapu, volnočasově se dloubám v Javě a nyní je mým velkým cílem Node.JS, ve kterém vidím potenciálního nástupce PHP.
Kontakt:
e-mail: filip.janecek28@gmail.com telefon: 702 885 801
V předešlé lekci jsme si ukázali potřebné předpoklady pro AngularJS, dneska si vytvoříme první jednoduchý AngularJS projekt.
Výraz (expression) se sestává z dvojitých chlupatých (složených) závorek - např.
{{ 4 + 4 }}
Další možností, jak můžeme výraz napsat je uvnitř directive:
ng-bind="výraz"
Více o directives se dozvíte v dalších dílech.
AngularJS výraz vyřeší a výsledek zobrazí přímo na místě, kde se výraz nachází. Výrazy v AngularJS se velmi podobají výrazům v Javascriptu - nemusí obsahovat jenom čísla, ale taky třeba proměnné (např.: x, y) a operátory (např.: +, -, +=). Např.:
{{ krestniJmeno + ' ' + prijmeni }}
Vytvořme projekt AngularJS s výrazem {{ 2+2 }}:
<!DOCTYPE HTML>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
</head>
<body>
<div ng-app="">
<p>Dva plus dva je {{ 2 + 2 }}.</p>
</div>
</body>
</html>
Prohlížeč nám vypíše: Dva plus dva je 4.
Všimli jste si atributu ng-app? Jedná se o tzv. directive. Pokud bychom directive neuvedli, prohlížeč by jednodušše vypsal:
Dva plus dva je {{ 2 + 2 }}.
nikoli:
Dva plus dva je 4.
Více o directives si řekneme v příštím díle tutoriálu.