import { TodoDataService } from './../service/data/todo-data.service' ; import { Component , OnInit } from '@angular/core' ; import { Router } from '@angular/router' ; export class Todo { constructor ( public id , public description , public done , public targetDate ) { } } @ Component ( { selector : 'app-list-todos' , templateUrl : './list-todos.component.html' , styleUrls : [ './list-todos.component.css' ] } ) export class ListTodosComponent implements OnInit { todos : Todo [ ] ; message : string ; constructor ( private todoService , private router ) { } ngOnInit ( ) { this . refreshTodos ( ) ; } refreshTodos ( ) { this . todoService . retrieveAllTodos ( 'in28minutes' ) . subscribe ( response => { console . log ( response ) ; this . todos = response ; } ) ; } deleteTodo ( id ) { console . log ( `delete todo ${ id }` ) ; this . todoService . deleteTodo ( 'in28minutes' , id ) . subscribe ( response => { console . log ( response ) ; this . message = `Delete of Todo ${ id } Successful!` ; this . refreshTodos ( ) ; } ) ; } updateTodo ( id ) { console . log ( `update ${ id }` ) ; this . router . navigate ( [ 'todos' , id ] ) ; } addTodo ( ) { this . router . navigate ( [ 'todos' , - 1 ] ) ; } }