AngularJS une los datos a HTML usando expresiones.
Expresiones AngularJS
AngularJS expresiones pueden escribirse entre llaves dobles: {{ expression }} .
AngularJS expresiones también se pueden escribir en el interior de una directiva: ng-bind=" expression " .
AngularJS resolverán la expresión, y devolver el resultado exactamente donde la expresión se escribe.
AngularJS expresiones son muy similares a las expresiones de JavaScript: Pueden contener literales, operadores y variables.
Ejemplo {{5 + 5}} o {{firstName + "" + lastName}}
Ejemplo
<!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>
Inténtalo tú mismo " Si quita el ng-app Directiva, HTML mostrará la expresión tal como es, sin resolverlo:
Ejemplo
<!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>
Inténtalo tú mismo " Puede escribir expresiones donde quieras, AngularJS Simplemente resolver la expresión y devolver el resultado.
Ejemplo: Supongamos AngularJS cambiar el valor de las propiedades CSS.
Cambiar el color de la caja de entrada de abajo, cambiando su valor:
Ejemplo
<div ng-app="" ng-init="myCol='lightblue'">
<input
style="background-color:{{myCol}}" ng-model="myCol" value="{{myCol}}">
</div>
Inténtalo tú mismo " números AngularJS
AngularJS números son como los números de JavaScript:
Ejemplo
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: {{ quantity * cost }}</p>
</div>
Inténtalo tú mismo " Mismo ejemplo usando ng-bind :
Ejemplo
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total in dollar: <span ng-bind="quantity * cost"></span></p>
</div>
Inténtalo tú mismo "  | Usando ng-init no es muy común. Usted aprenderá una mejor manera de inicializar los datos en el capítulo sobre los controladores. |
|---|
AngularJS Cuerdas
AngularJS cadenas son como cadenas JavaScript:
Ejemplo
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is {{ firstName + " " + lastName }}</p>
</div>
Inténtalo tú mismo " Mismo ejemplo usando ng-bind :
Ejemplo
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The name is <span ng-bind="firstName + ' ' + lastName"></span></p>
</div>
Inténtalo tú mismo " Objetos AngularJS
AngularJS objetos son como objetos JavaScript:
Ejemplo
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is {{ person.lastName }}</p>
</div>
Inténtalo tú mismo " Mismo ejemplo usando ng-bind :
Ejemplo
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The name is <span ng-bind="person.lastName"></span></p>
</div>
Inténtalo tú mismo " AngularJS matrices
AngularJS matrices son como matrices de JavaScript:
Ejemplo
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is {{ points[2] }}</p>
</div>
Inténtalo tú mismo " Mismo ejemplo usando ng-bind :
Ejemplo
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The third result is <span ng-bind="points[2]"></span></p>
</div>
Inténtalo tú mismo " AngularJS Expresiones Expresiones JavaScript vs.
Al igual que las expresiones de JavaScript, AngularJS expresiones pueden contener literales, operadores y variables.
A diferencia de las expresiones de JavaScript, AngularJS expresiones pueden escribirse dentro de HTML.
AngularJS expresiones no son compatibles con condicionales, bucles, y excepciones, mientras que las expresiones de JavaScript hacen.
AngularJS expresiones admiten filtros, mientras que las expresiones de JavaScript no lo hacen.