2.8. Ejercicios

Ejercicio 2.1: Listado de libros

Crea tu primera aplicación AngularJS ng-app con nombre UazonApp.

La aplicación debe mostrar un listado de libros a partir de un JSON estático cargado en memoria mediante las directivas ng-repeat y ng-init.

El JSON a cargar debe tener la siguiente estructura:

[
   {
     "id": "1",
     "titulo": "El Juego de Ender",
     "autor": "Orson Scott Card",
     "editorial": "Ediciones B / Zeta",
     "descripcion": "La Tierra está amenazada por una especie extraterrestre de insectos que pretende destruir la humanidad. Para vencerlos se precisa la intervención de un genio militar, por lo cual se permite el nacimiento de Ender, tercer hijo de una pareja en un mundo que limita a dos el número de descendientes. Ender se entrenará en una estación espacial, superará a sus rivales y se convertirá en la persona capaz de dirigir las flotas terrestres contra los insectos de otros mundos.",
     "img": "img/img1.jpg"
    },
    {
     "id": "2",
     "titulo": "Juego de tronos",
     "autor": "George R. R. Martin",
     "editorial": "Gigamesh",
     "descripcion": "Tras el largo verano, el invierno se acerca a los Siete Reinos. Lord Eddard Stark, señor de Invernalia, deja sus dominios para unirse a la corte de su amigo el rey Robert Baratheon, llamado el Usurpador, hombre díscolo y otrora guerrero audaz cuyas mayores aficiones son comer, beber y engendrar bastardos. Eddard Stark ocupará el cargo de Mano del Rey e intentará desentrañar una maraña de intrigas que pondrá en peligro su vida y la de todos los suyos. En un mundo cuyas estaciones pueden durar decenios y en el que retazos de una magia inmemorial y olvidada surgen en los rincones más sombríos y maravillosos, la traición y la lealtad, la compasión y la sed de venganza, el amor y el poder hacen del juego de tronos una poderosa trampa que atrapará en sus fauces a los personajes... y al lector.",
     "img": "img/img2.jpg"
    },
    {
     "id": "3",
     "titulo": "I robot",
     "autor": "Isaac Asimov",
     "editorial": "Edhasa",
     "descripcion": "Los robots de Isaac Asimov son máquinas capaces de llevar a cabo muy diversas tareas, y que a menudo se plantean a sí mismos problemas de 'conducta humana'. Pero estas cuestiones se resuelven en Yo, robot en el ámbito de las tres leyes fundamentales de la robótica, concebidas por Asimov, y que no dejan de proponer extraordinarias paradojas que a veces se explican por errores de funcionamiento y otras por la creciente complejidad de los 'programas'. Las paradojas que se plantean en estos relatos futuristas no son sólo ingeniosos ejercicios intelectuales sino sobre todo una indagación sobre la situación del hombre actual en relación con los avances tecnológicos y con la experiencia del tiempo.",
     "img": "img/img3.jpg"
    }
]

Ejercicio 2.2: Filtrar y ordenar el listado de libros

Al ejercicio 2.1 añade un pequeño filtro a tu listado de libros. Que se pueda filtrar por texto mediante la directiva ng-model y además ordenar por titulo y editorial. Utiliza los filters básicos para este cometido.

Ejercicio 2.3: Añade un controlador

Reestructura el código del ejercicio 2.2 para añadir el concepto del controlador en la aplicación y elimina el ng-init.

Crea un controlador con nombre librosCtrl donde en su constructor se cargue la información a mostrar en JOSN en memoria.

Comprueba que continua funcionando el ejemplo con su filtro y orderBy.

Ejercicio 2.4: Ficha libro

A partir del último ejercicio 2.3 construye una segunda pantalla: Ficha del libro. Para que desde el listado haz que cuando pinches sobre un libro o su imagen vayas directamente a esta nueva pantalla ficha del libro.

Crea varias vistas en tu interfaz:

• listado.html para el listado de libros
• ficha.html para la ficha del libro con un botón de volver atrás.

Añade a tu aplicación uazonApp el sistema de routing para poder navegar en tu primera aplicación one-page. Crea un segundo controllador para la ficha del libro si lo crees conveniente: libroFichaCtrl