Question

我正在创建一个表，该表中的数据正在不断更新。每行中都有一个按钮。我们在按钮的单击事件上添加了一个弹出窗口。由于数据的变化，该按钮如何闪烁。并且无法单击按钮。

我尝试了@ViewChild（https://angular.io/api/core/ViewChild），但对我不起作用。

 <tbody *ngFor="let runner of fancyRunners">
  <tr class="spacer">
    <td><button onload="loadBtn(runner.id)"  id="book-match-{{runner.id}}"   runat="server"  (click)="showAlert(runner)"  class="button rounded-full-btn cancel-btn custom-button">Book</button></td>
    <td class="priority-3"><b>{{runner.back2 | round}}</b><br />{{runner.backValue2 | round}}</td>
    <td class="priority-3"><b>{{runner.back1 | round}}</b><br />{{runner.backValue1 | round}}</td>
  </tr>
</tbody>

下面的代码在ts文件中，运行时间为200ms

  if(JSON.parse(message.body).fancy!=null){
  this.fancy = JSON.parse(message.body).fancy;
  }
  this.fancyRunners = this.fancy.runners;

我只想单击按钮。应该第一次呈现该按钮，而不是只更改其他数据。

Answer 1

由于this.fancyRunners = this.fancy.runners;的重新分配，各行将重新呈现，并且您的按钮闪烁。不要每次都将其分配给“ fancyRunners”，而是编写逻辑以进行第一次分配，然后在下一次更新该数组时（fancyRunners）。

连续更改数据中的按钮单击问题

1 个答案: