This makes a little form to add a new task but doesn’t actually function yet.

Update TaskService

First thing we should do is update TaskService so it can accept a new task to add to the collection of tasks and make any service calls that are needed.

Add to src/app/services/tast.service.ts

addTask(newTask: Task) {
return new Promise((resolve, reject) => {
console.log('pretend we called a service with our new task here')
this.tasks.push(newTask);
resolve();
});
}

Now we can call this from our NewTaskComponent.

Update NewTaskComponent

Lets add a method to src/app/new-task.component.ts called addTask. This addTask method will call the TaskService so we will need to have access to it. To get that access we will need to import the TaskService and pass it into the constructor.

Adding New Tasks

Looks like a success!

You may notice that there is data validation, we are not currently checking if a task has a title or maybe a description. We could add that but since this is just a sample app I’m going to put it off for meow.