Grab id of the button clicked on Angular

Asked

Viewed 886 times

0

I have several buttons with the same function and try to get the last id clicked, but always only one id comes.

HTML:

<div class="container">
<div class="row">
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="E" id="E" #ref (click)="but_no(ref.value)">CASA
      FECHADA</button>
  </div>
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="D" id="D" #ref (click)="but_no(ref.value)">ENDEREÇO
      NÃO LOCALIZADO</button>
  </div>
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="G" id="G" #ref (click)="but_no(ref.value)">CLIENTE
      REAGENDOU</button>
  </div>
</div>
<br>
<!-- ! -->
<div class="row">
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="F" id="F" #ref (click)="but_no(ref.value)">EXCEDEU
      O HORARIO</button>
  </div>
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="I" id="I" #ref (click)="but_no(ref.value)">CLIENTE
      REALIZOU</button>
  </div>
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="K" id="K" #ref (click)="but_no(ref.value)">ERRO
      DE ENTREGA</button>
  </div>
</div>

TS:

     but_no(value) {    
    this.valor = value  
    console.log(this.valor);      
  }

But no matter which button I click, it always comes the "K"

How do I get the exact button id clicked?

1 answer

2


each ref must be unique, try:

<div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="E" id="E" #ref1 (click)="but_no(ref1.value)">CASA
      FECHADA</button>
  </div>
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="D" id="D" #ref2 (click)="but_no(ref2.value)">ENDEREÇO
      NÃO LOCALIZADO</button>
  </div>
  <div class="col-sm">
    <button type="button" class="btn btn-primary bot-click" value="G" id="G" #ref3 (click)="but_no(ref3.value)">CLIENTE
      REAGENDOU</button>
  </div>
</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.