debounceTime() над вызовами API с использованием Rxjs

Question

Я пытаюсь понять rxjs и застрял в эксперименте debounceTime(n /* ms */).

общественного debounceTime (dueTime: номер, планировщик: Планировщик): Наблюдаемое

Выдает значение из источника наблюдаемого только после того, конкретный промежуток времени прошло без другого источника излучения.

source

Мой код:

function fakeAPI() { 
    return new Rx.Observable(observer => { 

    const root = 'https://jsonplaceholder.typicode.com' 

    $.ajax({ 
     url: root + '/posts/1', 
     method: 'GET' 
    }).then(function(data) { 
     observer.next(data) 
    }).fail(function(err) { 
     observer.error(err) 
    }) 

    return()=>{ 
     observer.complete() 
     console.log('unsubscribed!') 
    } 
    }) 
} 

const fakeObserver = fakeAPI() 

$('#buttonText').click(()=>{ 

    fakeObserver 
    .debounceTime(10000) 
    .subscribe(() => { 
     return { 
      next(item) { 
      console.log('received: ', item.id) 
      }, 
      error(err) { 
      console.log('error:', err) 
      }, 
      complete() { 
      console.log('completed!') 
      } 
     } 
    }()); 
}) 

Мои ожидания: Даже с N количеством кликов в заданный промежуток времени, вызов API будет только один раз. Вместо этого кажется, что он ждет заданное время, а затем все N кликов приводят к вызову API.

Что я делаю неправильно?

В соответствии с документами debounceTime (n) должен отбрасывать предыдущие ожидающие задержки выбросы, если новое значение поступает на источник.

Вот JSBin link

Answer 1

В соответствии с Документами, debounceTime (п), как предполагается, чтобы отменить предыдущие отложенные отсроченные выбросы, если новое значение поступает от источника.

Это верно, но на каждый клик:

1. Вы создаете новую подписку
2. Он называет апи
3. Api возвращает результат
4. debounceTime Уэйтс 10s (ничего не происходит, потому что observerable возвращаемый fakeObserver испускает только один раз)
5. Вы регистрируете результат

Вам необходимо конвертировать ваши клики в наблюдаемом осуществить то, что вы хотите:

Rx.Observable.fromEvent(document.getElementById('buttonText'), 'click') 

Проверить jsBin