July 2018
Intermediate to advanced
402 pages
9h 35m
English
Our task list looks nice already, but it would be quite useless if the user is unable to add new tasks to the list. Let's create a component for entering new tasks together. Let's create a new component with the responsibilities of handling all the UI logic necessary for entering a new task to our list.
Let's use the Angular CLI tool to create a new component stub:
ng generate component --spec false -ve none tasks/enter-task
Open up the template of the newly created component located at src/app/tasks/enter-task/enter-task.component.html and apply the following changes:
<input type="text"
placeholder="Enter new task title..."
#titleInput>
<button (click)="enterTask(titleInput)">
Add Task
</button>
This template consists of an ...