<table class="table">
<thead class="h">
<tr class="h">
<th class="h">Title</th>
<th class="h">Description</th>
<th class="h">Date</th>
<th class="h">Status</th>
<th class="h">Options</th>
</tr>
</thead>
<tbody>
<tr class="todo" (dblclick)="editTodo(todo)" *ngFor="let todo of todosList">
<ng-container *ngIf="!editTodos.includes(todo); else editTD">
<td>{{todo.title}}</td>
<td>{{todo.description}}</td>
<td>{{todo.date | date}}</td>
<td>{{todo.status}}</td>
</ng-container>
<ng-template #editTD>
<td><input type="text" name="title" id="title" (keypress)="submitTodo($event, todo)" [(ngModel)]="todo.title" placeholder="Title" class="form-control"></td>
<td><input type="text" name="description" id="description" (keypress)="submitTodo($event, todo)" [(ngModel)]="todo.description" placeholder="Description"
class="form-control"></td>
<td>{{todo.date | date}}</td>
<td>
<input type="text" name="status" id="status" (keypress)="submitTodo($event, todo)" [(ngModel)]="todo.status" placeholder="Status" class="form-control">
</td>
</ng-template>
<td class="o">
<button class="btn btn-success" (click)="doneTodo(todo)">
<i class="fa fa-check"></i>
</button>
<button class="btn btn-primary" (click)="editTodo(todo)">
<i class="fa fa-pencil"></i>
</button>
<button class="btn btn-danger" (click)="deleteTodo(todo)">
<i class="fa fa-trash"></i>
</button>
</td>
</tr>
</tbody>
</table>