Taller 2: Implementar detalle de listas simples
Nota
URL: | https://github.com/Uniandes-isis2603/sportcenter.git |
---|---|
Release: | git checkout -f taller-2 |
Objetivos
Se espera que al final de este taller el estudiante esté en capacidad de:
- Explicar del framework angularJS lo básico sobre Vista, Controlador, Modelo y Scope para desarrollar las aplicaciones web.
- Implementar requerimientos básicos de despliegue de información en una aplicación Web, utilizando angularJS.
- Implementar detalle de listas simples para las entidades de trainers y sportcenters.
Taller 2
- Ejecutar sportcenter.
- Crear detalle de lista simple para trainers.
- Crear detalle de lista simple para sportcenters.
- Subir cambios y hacer release.
1. Ejecutar sportcenter.
Una vez que haya clonado el taller 2 ejecútelo siguiendo los pasos del taller 1.
Después de realizar las instrucciones debería mostrarse el detalle de trainers similar al de sports como la siguiente la imagen.
2. Crear detalle de lista simple para trainers.
Adicionar el campo avatar a la colección de los trainers para poder visualizar su imagen en el detalle.
Crear un nuevo template llamado trainers.html que contendrá la vista para el detalle y la lista de los trainers disponibles. Es decir, El template define las dos nuevas vistas: una para el detalle (
<div ui-view="detailView"></div>
) y otra para la lista (<div ui-view="listView"></div>
). Para más información puede consultar frontstepbystep.Crear un nuevo controlador para el detalle de trainers nómbrelo como trainers.detail.ctrl.js. Este controlador recibirá como parámetro el id del trainer a consultar.
Crear un nuevo template para el detalle trainers.detail.html.
Crear el estado asociado al detalle en el archivo trainers.mod.js realizado en el taller 1. Recuerde que, debe tener en cuenta la jerarquía de estados. Para más información puede consultar frontstepbystep en la sección Jerarquía de estados en el módulo bookModule.
Incluir trainers y el estado de detalle en el archivo trainers.list.html realizado en el taller 1. para que el usuario pueda dar clic sobre el nombre y se pueda mostrar el detalle.
Incluir los archivos creados en el index.html.
3. Crear detalle de lista simple para sportcenters.
Para este paso realice las instrucciones de Crear detalle de lista simple para trainers. Recuerde adicionar el campo de imagen del centro deportivo y el campo historia.
4. Subir cambios y hacer release.
En este último paso debe subir los cambios al repositorio, el nombre del commit y release debe ser "taller-2".