rxjs6 - 我如何使用 rxjs 忽略第二个、第三个按钮单击，直到我的第一个按钮单击过程完成

Question

我的 HTML 有以下代码：

button (click)="doFunc()" 

在我的 ts 文件中，我有以下内容：

doFunc(){
    this.service.executeAFuncWhichIsAsynchronous().subscribe(x => { updateMyUi(); });
}

当我单击该按钮两次时，会进行两次服务调用。我不希望这种情况发生。相反，应忽略后续点击。

我怎样才能做到这一点？

Answer 1

我会尝试在你的状态管理器中的函数调用之前设置一个标志（如果你正在使用一个）来确定调用是否成功。然后在您的异步函数中，如果设置了该标志，则拒绝继续。它看起来像这样

import state from './state'

function someAsyncFunc()
{
  if (state.executing) {return}
  else
  {
   state.executing = true;
   setTimeout(function(){ console.log("got here");state.executing=false;return; }, 3000);
  }
}

async function doFunc()
{
  await someAsyncFunc();
}

doFunc()
doFunc()
doFunc()

Answer 2

只需先订阅即可。https://rxmarbles.com/#first

像这样

doFunc(){ 

  this
    .service
    .executeAFuncWhichIsAsynchronous()
    .first()
    .subscribe(x => updateMyUi(x)); 

}