Отмена предыдущего наблюдаемого, возвращенного из другой функции

#javascript #rxjs-observables

#javascript #rxjs-наблюдаемые

Вопрос:

У меня ситуация, когда мне нужно отменить предыдущее наблюдаемое, если возвращается новое наблюдаемое. Смотрите ниже

 function fooService(timeOut: number): Observable<string> {
    return new Observable(subs => {
        setTimeout(() => {
            subs.next(new Date().toTimeString());
        }, timeOut);
    });
}

function barComponent(timeOut: number): void {
    // here it should cancel previous subscription if this function called again
    fooService(timeOut).subscribe(
        time => console.log(time)
    );
}


barComponent(5000);
barComponent(2000); // i need to cancel last call
 

Ответ №1:

Вы можете сохранить наблюдаемую подписку в переменную, а затем вызвать unsubscribe , если она была вызвана один раз следующим образом:

 let observableInstance;

function fooService(timeOut: number): Observable<string> {
  return new Observable(subs => {
    setTimeout(() => {
      subs.next(new Date().toTimeString());
    }, timeOut);
  });
}

function barComponent(timeOut: number): void {
  if (observableInstance) {
    observableInstance.unsubscribe();
  }
  observableInstance = fooService(timeOut).subscribe(time => console.log(time));
}

barComponent(5000);
barComponent(2000); 

Рабочий стекблитц:

https://stackblitz.com/edit/rxjs-mb38xc?devtoolsheight=60