Как лучше всего определить нажатую кнопку, если кнопка идет из списка в Angular?

Question

У меня есть список элементов, и я отображаю эти элементы с помощью * ngFor.И у меня есть кнопка с функцией на каждом повторяющемся независимом элементе.Код ниже.

 <ul *ngFor="let data of datas">

//                 . . .

                <button
                  type="button"
                  class="btn btn-secondary btn-circle btn-sm"
                  (click)="showDetail(**parameter**)"
                  >  show
                </button>
//                 . . .

Это моя функция показа.Я понятия не имею, что передать в этом параметре .

increment(**parameter**) {
    console.log(this.data[**parameter**]['price']);
  }

. Я хочу отобразить цену конкретного выбранного элемента.Мой список данных ниже.

[
      { id: "1111", guest: "abc", price: 20 },
      { id: "222", guest: "xyz", price: 30 }    ]

Answer 1

Вы можете отправить data в качестве параметра

<ul *ngFor="let data of datas">
...
  <button type="button" class="btn btn-secondary btn-circle btn-sm" (click)="showDetail(data)">  
      show
   </button>
...
</ul>


increment(data) {
  console.log(data.price);
}

Или вы можете отправить index

<ul *ngFor="let data of datas; let i = index">
...
  <button type="button" class="btn btn-secondary btn-circle btn-sm" (click)="showDetail(i)">  
      show
   </button>
...
</ul>


increment(index) {
  console.log(this.data[index]['price']);
}