How do i use rxjs to ignore second,third button click till my first button click process is complete

user_13238759 0
Viewed 316

My HTML has the following code:

button (click)="doFunc()"

In my ts-file I have the following:

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

When I click the button twice, two service calls are made. I don't want this to happen. Instead, subsequent clicks should be ignored.

How can I accomplish this?

rxjs6 rxjs-observables
2 Answers

I would try setting a flag before the function call in your state manager (if you're using one) to determine if the call went. Then in your async function if that flag is set, refuse to continue. It would look something vaguely like this

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()
user_113704500

Just subscribe to first. https://rxmarbles.com/#first

Like this 

doFunc(){ 

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

}

user_1860990
Related