javascript - Creating a filterable list with RxJS -

i'm trying reactive programming. use array-functions map, filter , reduce time , love can array manipulation without creating state.

as exercise, i'm trying create filterable list rxjs without introducing state variables. in end should work similar this:

i know how accomplish naive javascript or angularjs/reactjs i'm trying nothing rxjs , without creating state variables:

var list = [   'john',   'marie',   'max',   'eduard',   'collin' ];  rx.observable.fromevent(document.queryselector('#filter'), 'keyup')   .map(function(e) { return e.target.value; });  // need search value in here somehow: rx.observable.from(list).filter(function() {});  

now how search value filter function on observable created list?

thanks lot help!

you'll need wrap from(list) need restart list observable again every time filter changed. since happen lot, you'll want prevent filtering when filter short, or if there key stroke within small time frame.

//this cold observable we'll go ahead , make here var reactivelist = rx.observable.from(list);  //this perform our filtering function filterlist(filtervalue) {   return reactivelist.filter(function(e) {    return /*do filtering filtervalue*/;   }).toarray(); }   var source = rx.observable.fromevent(document.queryselector('#filter'), 'keyup')   .map(function(e) { return e.target.value;})    //the next 2 operators stop filtering before    //the user done typing or if input small   .filter(function(value) { return value.length > 2; })   .debounce(750 /*ms*/)    //cancel inflight operations if new item comes in.   //then flatten 1 sequence   .flatmaplatest(filterlist);  //nothing happen until you've subscribed source.subscribe(function() {/*do list*/}); 

this adapted 1 of standard examples rxjs here