AngularJS 2: Výrazy

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.