Beruflich Dokumente
Kultur Dokumente
ANGULAR JS DE 0 A 100
EXPRESIONES EN ANGULAR JS
MSC. NORMAN ARAUZ
NORMAN SALVADOR ARUZ LPEZ
UNAN MANAGUA, FAREM MATAGALPA
De esta manera hemos convertido nuestro documento HTML en una app de Angular. Lo
siguiente ser la explicacin sobre las expresiones.
Las expresiones pueden estar en cualquier parte del documento HTML, por ejemplo
iniciaremos insertando una expresin dentro de un prrafo.
Una expresin tiene una sintaxis muy sencilla de utilizar, debo hacerla de la siguiente manera
{{expresin}}. En el siguiente ejemplo escribo una cadena de texto y vamos a saludar:
Expresin cadena es
constante
En el navegador se visualiza:
En el navegador:
Vemos como ahora mi
expresin
aparece
completamente
integrada en el titular.
Las expresiones no
solamente
van
a
soportar cadenas de
texto, podremos incluir
tambin nmeros, por
ejemplo vamos a escribir un {{10}}:
En el navegador:
Vemos que nos muestra un nmero,
adems podemos realizar procesos y
clculos simples o complejos, probaremos
con una situacin aritmtica simple para
ilustrar el ejemplo, haremos: {{2+3*4}}
cuyo resultado ser 14 por la presidencia
de operadores, es decir al igual que otros
lenguajes de programacin angular
respeta esta regla.
En el navegador:
Vemos como el formato ha variado, por la
precedencia de operadores utilizando
aparentemente la misma expresin.
En el navegador:
Vemos que nos aparece integrada la expresin con el resto del contenido HTML, y esto ser
totalmente transparente al usuario.
La siguiente parte de las expresiones en angular es el uso de filtros. Veamos en el siguiente
apartado de Uso de filtros.
Los filtros en angular, nos permiten darle formato a nuestra informacin en HTML, de esta
forma podremos cambiar ligeramente la informacin que obtenemos de nuestra app para que
se ajuste a nuestras necesidades, como vemos en la imagen anterior ya tenemos ligado el
documento al framework de angular y adems de eso hemos indicado que el documento se trata
de una aplicacin de angular.
Vamos a imaginar que tenemos una tienda de verduras, donde venderemos diferentes tipos de
verduras, crearemos una lista con tres tipos de elementos diferentes:
En el navegador aparecer:
El filtro hace que el nmero que agregamos sea
tratado como una moneda, como se logra eso,
estamos trabajando con un filtro que le ha agregado
formato al valor que tenamos. En el caso que no
definamos un formato en especfico se definir por
defecto como si el formato de la moneda fuese en
dlares.
Vamos con el siguiente elemento, supongamos que el precio del brcoli est dado en euros,
veamos:
Luego en el navegador:
Vemos que lgicamente el error
persiste, tanto en nuestro cdigo
HTML como en el navegador, ahora
corregiremos este y cualquier otro
error relacionado que pudiese
ocurrir:
Uppercase
De esta manera evitaremos cualquier error de escritura en cuanto a uso de caracteres. Los
filtros ayudan a dar formato rpido a la informacin que tengamos en angular js.