javascript - 如何触发一次警报/swal 函数而不重复触发？

Question

我是 Angular 新手。

我有一个应用程序，其中有两个变量指示金融交易的状态。 这些变量是:tab1TrxMessage，用于存储任何消息；tab1TrxStatus，用于指示事务状态:失败、< strong>已成功或正在等待。当交易失败时，我希望用户收到与此类似的 swal 警报/通知:

swal({
       title:'Error!',
       text: 'Warning... Transaction failed!',
       type: 'error',
       confirmButtonText: 'Ok',
       confirmButtonColor: '#ff754f'
     });

目前，我的代码如下所示:

../component.html

<div class="sign-btn text-center">
  <a class="btn btn-lg text-white">
    <span *ngIf="tab1TrxMessage">{{tab1TrxMessage}}</span>
    <span *ngIf="!tab1TrxMessage && tab1TrxStatus != 'Success'">Failed</span>
    <span *ngIf="transactionFailed()">Failed</span>
  </a>
</div>

特别注意transactionFailed()函数...

../component.ts

public transactionFailed() {

    if(this.tab1TrxMessage == 'Failed: Cancelled by User' && this.tab1TrxStatus != 'Success') {

        console.log("You are in transactionFailed!")

        swal({
           title:'Error!',
           text: 'Warning... Transaction failed!',
           type: 'error',
           confirmButtonText: 'Ok',
           confirmButtonColor: '#ff754f'
         });

         return true;
    }

    return false;
}

上面的代码，当交易失败时，会在浏览器控制台中多次产生:You are in transactionFailed!...

...swal 警报也会反复弹出，其中包含 Warning... Transaction failed!。

是否有更好的方法来解决此问题，以便 swal 警报仅在每个失败的交易中显示 ONCE？

期待您的帮助。

Answer 1

创建一个计数器，它只会运行您的代码一次。例如。

failedTransactionCntr = 0;
public transactionFailed() {

    if(this.tab1TrxMessage == 'Failed: Cancelled by User' && this.tab1TrxStatus != 'Success') {

        console.log("You are in transactionFailed!")
        if (this.failedTransactionCntr == 0) {
          swal({
           title:'Error!',
           text: 'Warning... Transaction failed!',
           type: 'error',
           confirmButtonText: 'Ok',
           confirmButtonColor: '#ff754f'
         });
         this.failedTransactionCntr ++;
        }
         return true;
    }

    return false;
}