加载微调器会在页面上的每个按钮上激活 [英] Loading Spinner activates on every button on the page

问题描述

我正在尝试将加载微调器集成到按钮中.这也很有效.问题:如果我点击一个按钮，微调器会响应每个额外的按钮.

I'm trying to integrate a loading spinner into a button. This also works very well. The problem: If I click on a button, the spinner will respond to every additional button.

我该如何纠正这个问题?

How can I correct this?

我的代码:

<button ion-button block (click)="loading = true">
  <ion-spinner class="whiteSpinner" item-left *ngIf="loading" name="bubbles"></ion-spinner>
  Buy now - 1,49€
</button>

其他按钮类似...

图片向您展示我的意思:

Image to show you what I mean:

推荐答案

如果你有一堆动态按钮，你可以给它们添加唯一的 id.即使您使用例如 *ngFor 来生成所有按钮，它们也将具有与本例中的 myButton 不同的唯一 ID.

If you have bunch of dynamic buttons you can add unique id to them. Even if you use for example *ngFor to generate all buttons they will have unique ids different from in this case myButton.

<button #myButton ion-button block (click)="myButton.loading = true">
  <ion-spinner class="whiteSpinner" item-left *ngIf="myButton.loading" name="bubbles"></ion-spinner>
  Buy now - 1,49€
</button>

这篇关于加载微调器会在页面上的每个按钮上激活的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！