Learn TypeScript 3 by Building Web Applications

Creating the TodoListController interface

First, let's define our controller interface, TodoListController. Add it underneath the HTMLTodoListView class:

interface TodoListController { 
    addTodo(): void; 
    filterTodoList(): void; 
    removeTodo(identifier: string): void; 
} 

This interface might surprise you because, apart from the removeTodo method, the methods don't accept parameters. The reason for this is that our view will interact with the controller layer by passing signals to it.

To give you an example, when you click on the Add button or press Enter to add an item to the list, then it will simply invoke the addTodo method on the controller. Then, the controller's implementation will ask its view (more precisely, its view model) to get the ...