<div class="content">
    <div class="ui right floated compact segment" (click)="toggleState()">
        <input type="checkbox" [id]="id" [(ngModel)]="todo.done" (change)="toggleState()" />
        <label [attr.for]="id"></label>
    </div>
    <a class="header" [class.finished]="todo.done">{{todo.name}}</a>
    <div class="meta" *ngIf="todo.done">
        <span> <i class="checkmark box icon"></i> Terminado há {{todo.doneDate | relativeTime}} </span>
    </div>
    <div class="description" *ngIf="todo.description">
        <p>
            {{todo.description}}
        </p>
    </div>
    <div class="extra">
        <button class="ui green tiny labeled icon button" (click)="onEdit.emit(todo)">
            <i class="edit icon"></i>
            Editar
        </button>
        <button class="ui red tiny labeled icon button" (click)="onRemove.emit(todo)">
            <i class="trash icon"></i>
            Excluir
        </button>
    </div>
</div>
<div class="content">
    <div class="ui right floated compact segment" (click)="toggleState()">
        <input type="checkbox" [id]="id" [(ngModel)]="todo.done"/>
        <label [attr.for]="id"></label>
    </div>
    <a class="header" [class.finished]="todo.done">{{todo.name}}</a>
    <div class="meta" *ngIf="todo.done">
        <span> <i class="checkmark box icon"></i> Terminado há {{todo.doneDate | relativeTime}} </span>
    </div>
    <div class="description" *ngIf="todo.description">
        <p>
            {{todo.description}}
        </p>
    </div>
    <div class="extra">
        <button class="ui green tiny labeled icon button" (click)="onEdit.emit(todo)">
            <i class="edit icon"></i>
            Editar
        </button>
        <button class="ui red tiny labeled icon button" (click)="onRemove.emit(todo)">
            <i class="trash icon"></i>
            Excluir
        </button>
    </div>
</div>
Change trigger for Change Event
Change trigger for Change Event

Fires event when click in the compact segment instead of just in checkbox