Item deletado somente no terceiro click [closed]

I'm using Angular. I have a delete event called on a button, and the delete only executes on the third click. However, the if statement executes the first time. I've tried changing the order, putting the delete before the if statement, but it didn't work.

HTML:

<button type="button" class="delete" mat-icon-button (click)="deletarItem()">
<mat-icon class="material-icons-outlined fix-icon">delete</mat-icon>
</button>


TS:

deletarItem() {

if (this.filterIndex === 2 && this.groupIndex === 0 && this.tableInstance === 'exportarTabela') {
const instanceIndex1 = `regra-item-${this.entity}-${this.tableInstance}-0-1`;
this.scope.field.setValue('dynamicFilter', instanceIndex1, 'operador', "==");
}

this.delete.emit();
}

Continue reading...