logo angularJS

Aprendiendo AngularJS (VIII). El servicio $http y JSON

¿Qué es JSON?

JSON es JavaScript Object Notation y es una sintaxis o formato utilizado básicamente para el intercambio de datos. Actualmente es muy utilizado en el desarrollo web puesto que es más fácil de utilizar que XML y más práctico.

Entre las ventajas que encontramos en JSON es que es mucho más ligero que XML y no solo eso, es mucho más fácil de entender que XML (aunque este último no es que sea muy complejo).

Además JSON utiliza la sintaxis de JavaScript con lo cual los programadores se sienten más familiarizados.

Veamos un ejemplo de JSON:

{"coches":[
{"Marca":"Ford", "Modelo":"Escort"},
{"Marca":"Volkswagen", "Modelo":"Passat"},
{"Marca":"Opel", "Modelo":"Astra"}
{"Marca":"Ford", "Modelo":"Mondeo"},
{"Marca":"Volkswagen", "Modelo":"Beetle"},
{"Marca":"Mercedes", "Modelo":"SLK"}
{"Marca":"Ford", "Modelo":"Focus"},
{"Marca":"Volkswagen", "Modelo":"Polo"},
{"Marca":"Opel", "Modelo":"Moka"}
]}
Ejercicio 8.1.
Transforma los datos anteriores al formato XML.
Ahora cuenta el número de caracteres que has empleado para describir los datos en ambos lenguajes.
¿Qué diferencias observas?

Ahora que sabes lo que es JSON te pedimos que hagas el siguiente ejercicio:

Ejercicio 8.2.
1 – Guarda los datos en formato JSON en una página web datos.htm
2 – Utiliza el método get() del servicio $http para recuperar los datos de la página anterior datos.htm. Si tienes dudas visita la siguiente página.
3 – Utiliza la directiva ng-repeat para visualizar uno a uno los datos en una tabla. Si tienes dudas de cómo funciona la directiva ng-repeat visita la siguiente página.
Ejercicio 8.3.
Sabías que es posible ordenar los datos de la directiva
<tr ng-repeat=”x in coches | orderBy : ‘Marca’”>
Para dejar bonito nuestro ejercicio anterior queremos que los datos estén ordenados por Marca.
Completa el ejercicio y prueba que funciona correctamente.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>