-
Notifications
You must be signed in to change notification settings - Fork 0
/
item.component.html
41 lines (37 loc) · 1.12 KB
/
item.component.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<div class="item">
<input
[id]="item.description"
type="checkbox"
(change)="item.done = !item.done"
(click)="completeItem()"
[checked]="item.done"
/>
<!-- aplica o estilo da classe complete qdo o item.done -->
<label [for]="item.description" [ngClass]="{ complete: item.done }">
{{ item.description }}</label
>
<!-- renderiza qdo o editable é negado -->
<div class="btn-wrapper" *ngIf="!editable">
<button class="btn" (click)="editable = !editable">Editar</button>
<button class="btn btn-warn" (click)="remove.emit()">Deletar</button>
</div>
<!-- renderiza qdo o editable está ativo -->
<div *ngIf="editable">
<input
class="sm-text-input"
placeholder="edit item"
[value]="item.description"
#editedItem
(keyup.enter)="saveItem(editedItem.value)"
/>
<div class="btn-wrapper">
<button class="btn btn-cancel" (click)="editable = !editable">
Cancelar
</button>
<button class="btn btn-save" (click)="saveItem(editedItem.value)">
Salvar
</button>
</div>
</div>
<!-- fim da seção editable -->
</div>