Servicios
¿Qué y por qué?
Los servicios son funciones de Javascript que responden a una específica tarea solamente. Los servicios de Angular son inyectatos a través del mecanismo de Inyección de dependencias e incluyen valor, funcieon o característica requerida por la aplicación. En nuestra aplicación, vamos a necesitar un servicio que guarde las tareas y lo usaremos para inyectarlas en los componentes.
Creación
Para crear un nuevo servicio con Angular CLI, necesitamos escribir el siguiente comando:
Este comando generará el servicio y lo colocará en src/app/todo-list.service.ts
Proveerlo en ngModule
Ahora, para usar el servicio, necesitamos proveerlo en el componenten NgModule
.
En src/app/app.module.ts
, agrega el código de importación:
Ahora agrega el servicio al arreglo de providers
, ese componente ngModule
se verá así:
Esto nos permitirá crear la instancia del servicio y usarla en cualquier lugar de nuestra app.
Mover la lista del componente al servicio:
Ahora vamos a mover el arreglo todoList
del componente a nuestro servicio. El servicio ahora tendrá:
Crear un método en el servicio para retornar la lista
Ahora ve al archivo generado del servicio, encontrado en src/app/todo-list.service.ts
, y agrega una función getTodoList
que retorna el arreglo todoList
. El servicio se verá así:
Inyectar el servicio al componente list-manager
list-manager
Después de crear la instancia del servicio, podemos inyectarlo a nuestro componente list-manager
. Ve al archivo src/app/list-manager/list-manager.component.ts
y agrega el siguiente código:
Y ahora úsalo en la clase ListManagerComponent: Elimina el arreglo
todoListpero guarda el miembro
todoList` y cambia el contructor a:
Y ahora todoList
usará el servicio que creamos en la función ngOnInit:
Last updated