AngularJS lie les données au format HTML en utilisant des expressions.
AngularJS expressions
AngularJS expressions peuvent être écrites à l' intérieur des accolades doubles: {{ expression }} .
AngularJS expressions peuvent également être écrites dans une directive: ng-bind=" expression " .
AngularJS résoudront l'expression, et retourner le résultat exactement où l'expression est écrit.
AngularJS expressions sont un peu comme des expressions JavaScript: Ils peuvent contenir des littéraux, des opérateurs et des variables.
Exemple {{5 + 5}} ou {{firstName + "" + lastName}}
Exemple
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
Essayez - le vous - même » Si vous supprimez le ng-app directive, HTML affiche l'expression telle qu'elle est, sans le résoudre:
Exemple
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div>
<p>My first expression: {{ 5 + 5 }}</p>
</div>
</body>
</html>
Essayez - le vous - même » Vous pouvez écrire des expressions où vous le souhaitez, AngularJS aurez simplement résoudre l'expression et renvoie le résultat.
Exemple: Soit AngularJS changer la valeur des propriétés CSS.
Changer la couleur de la zone de saisie ci-dessous, en changeant sa valeur:
Exemple
<div ng-app="" ng-init="myCol='lightblue'">
<input
style="background-color:{{myCol}}" ng-model="myCol" value="{{myCol}}">
</div>
Essayez - le vous - même » Numbers AngularJS
AngularJS chiffres sont comme les numéros JavaScript:
Exemple
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: {{ quantity * cost }}</p>
</div>
Essayez - le vous - même » Même exemple en utilisant ng-bind :
Exemple
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: <span ng-bind="quantity * cost"></span></p>
</div>
Essayez - le vous - même »  | Utilisation de ng-init est pas très commun. Vous apprendrez une meilleure façon d'initialiser les données dans le chapitre sur les contrôleurs. |
|---|
AngularJS Strings
AngularJS cordes sont comme des chaînes JavaScript:
Exemple
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is {{ firstName + " " + lastName }}</p>
</div>
Essayez - le vous - même » Même exemple en utilisant ng-bind :
Exemple
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is <span ng-bind="firstName + ' ' + lastName"></span></p>
</div>
Essayez - le vous - même » Objets AngularJS
AngularJS objets sont comme des objets JavaScript:
Exemple
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is {{ person.lastName }}</p>
</div>
Essayez - le vous - même » Même exemple en utilisant ng-bind :
Exemple
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is <span ng-bind="person.lastName"></span></p>
</div>
Essayez - le vous - même » AngularJS Arrays
AngularJS tableaux sont comme des tableaux JavaScript:
Exemple
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is {{ points[2] }}</p>
</div>
Essayez - le vous - même » Même exemple en utilisant ng-bind :
Exemple
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is <span ng-bind="points[2]"></span></p>
</div>
Essayez - le vous - même » AngularJS Expressions vs JavaScript Expressions
Comme expressions JavaScript, AngularJS expressions peuvent contenir des littéraux, des opérateurs et des variables.
Contrairement à des expressions JavaScript, AngularJS expressions peuvent être écrites à l'intérieur HTML.
AngularJS expressions ne supportent pas conditionals, boucles, et des exceptions, alors que les expressions JavaScript font.
AngularJS expressions prennent en charge les filtres, alors que les expressions JavaScript ne le font pas.