javascript - Best way to get value from another observable without combineLatest -

i have 2 observables in 2 dom events. 1 'dragstart' event , other 'drop' event. dragstart start first, , hold variable until dropevent observable fires.

here's quick example clarify:

this.containerel = document.queryselector...  var dragstart$ = observable.fromevent(this.containerel, 'dragstart')         .map((e) => e.target)  var dropevent$ = observable.fromevent(this.containerel, 'drop')         .map((e) => e.target)  var subscription = dropevent$.subscribe( (el) =>{   el.appendchild( **need dragstart el here** ) }) 

i tried using combinelatest(dragstart$,dropevent$) on subscription won't work because dragstart$ fire before dropevent$.

note

my goal not use external state on this. ie: set global var on dragstart$ , accessing on dropevent$.

what solution this? im sorta learning rxjs right expert opinion appreciated!

since know drop events must follow dragstart events, best way model drag/drop sequence single observable. start observing drop event after receive start event:

// observes start events const start$ = observable.fromevent(this.containerel, 'dragstart'); // observe *next* drop event const nextdrop$ = observable.fromevent(this.containerel, 'drop').take(1);  const dragdrop$ = start$     // each start event, listen next drop event     .flatmap({target: startel} => nextdrop$         // drop event, return start , end elements         .map({target: endel} => ({startel, endel})));  const subscription = dragdrop$.subscribe(({startel, endel}) => {     endel.appendchild(startel); });