How do I disable two buttons at once? ANGULAR

Question

I have two buttons that their ID comes from a database die:

<tr *ngFor="let dads of DadosOs">
        <td><button type="button" class="btn btn-success but" id="{{dads.NUMOS}}  - A" value = "{{dads.CODPROD}} - {{dads.ITEM}}"
            #ref (click)="BaixaOkey(ref.id, ref.value)">SIM</button></td>
        <!-- ! -->
        <td><button type="button" class="btn btn-danger but" id="{{dads.CODPROD}} - {{dads.ITEM}} " value="{{dads.NUMOS}}"
            #ref2 (click)="not(ref2.id, ref2.value)" data-toggle="modal" data-target="#modalNao">NÃO</button></td>
        <!-- ! -->
        <td>{{dads.ITEM}}</td>
        <td>{{dads.CODPROD}} - {{dads.PRODUTO}}</td>
  </tr>

And on TS I try to disable like this:

(<HTMLInputElement>document.getElementById(id)).disabled = true;

But then just disable the 'YES' button but I need to disable the 'NO' button too.

Have any way to disable both buttons at the same time other than by ID?

Answer 1

Take a look if it helps you

ts:

const desabilitarBotoes = false;

export class Classe {

    metodoNoMeioDoCodigo() {
        if (algumaCoisa) {
            this.desabilitarBotoes = true;
        }
    }

}

html:

<button id="botao1" class="" (click)="clickBotao1()" [disabled]="desabilitarBotoes">
<button id="botao2" class="" (click)="clickBotao2()" [disabled]="desabilitarBotoes">

Or, to always check if disable or not use:

public get desabilitarBotoes() {
    return algumaCoisa;
}