Rx rimbalzo dell'operatore con il primo e l'ultimo

Question

Esiste una combinazione di operatori rx in modo da ottenere il primo e l'ultimo evento rimbalzato?

Questo verrà utilizzato in scenari di dettaglio master (o anche scenari di seach) in cui vogliamo il caricamento immediato del primo elemento selezionato e l'ultimo dopo che l'utente interrompe la selezione.

Ciò impedirà l'iniezione del tempo di antirimbalzo quando l'utente naviga lentamente ma impedisce anche scoppi di modifiche.

Se l'operatore debounce aveva un'opzione "immediata" come underscore.js debounce functoin, l'unione delle due versioni dell'operatore di debounce generava il risultato necessario.

Answer 1

Per ottenere il primo elemento di debounced, è possibile utilizzare throttle. Per ottenere l'ultimo, è possibile utilizzare debounce. Tuttavia, è necessario assicurarsi che la sorgente che si sta rimbalzando o riducendo sia una fonte attiva, poiché si applicheranno entrambi gli operatori alla stessa origine. Quindi se vuoi entrambi gli elementi nello stesso osservabile, puoi semplicemente unire i flussi rallentati e rimossi.

Ad esempio, la chiamata source$ la vostra fonte osservabile:

firstAndLast$ = Rx.Observable.merge(source$.debounce(Xms), source$.throttle(Xms)) 

Questo dovrebbe rilasciare il primo oggetto e l'ultimo elemento di una raffica nello stesso flusso. Si noti che nel caso limite che non si tratta di un burst ma di un singolo valore che si verifica nel periodo temporale Xms, è possibile avere il doppio dello stesso valore, uno all'inizio del periodo e uno alla fine. Un modo per proteggere contro che, se questo ha un senso è quello di utilizzare distinctUntilChanged, quindi questa diventa:

firstAndLast$ = Rx.Observable.merge(source$.debounce(Xms), source$.throttle(Xms)).distinctUntilChanged() 

Answer 2

Un operatore ibrido con UX-friendly comportamento: https://www.npmjs.com/package/rx-op-debounce-throttle

Emette primo e l'ultimo componenti di una partita, più il più possibile eventi all'interno della finestra, separati da almeno X ms.

Answer 3

La semplice combinazione dell'acceleratore e del rimbalzo come suggerito nella risposta precedente non mi è bastata perché emette periodicamente nuovi eventi quando scade il tempo di accelerazione.

const debounced$ = source$.debounceTime(time) 
return source$.throttleTime(time) 
    .merge(debounced$).distinctUntilChanged() 

Con un time=30 si otterrebbe:

-a-a-a-a-a-a---- 
-a---a---a----a- 

Per ottenere solo il primo e l'ultimo evento con un tempo minimo tra ho usato:

const debounced$ = source$.debounceTime(time) 
return source$.throttle(() => debounced) 
    .merge(debounced$).distinctUntilChanged() 

che si traduce in:

-a-a-a-a-a-a---- 
-a------------a-