RxJS Observable.fromEvent data

Question

How can I attach event data to a Observable.fromEvent?

In my example I have the following array of objects

var people = [
    { name: "Bert", img: "" },
    { name: "Enrie", img: "" },
    { name: "Elmo", img: "" }
];

I want to create a clickStream with a data.src something like:

clickStream = Rx.Observable.fromEvent(li, 'click', { src :  people[p].img });

And then subscribe to it:

clickStream.subscribe(function(event) {
    $('#img')[0].src = event.data.src;
});

API documentation for fromEvent method

Edit

I created a JsFiddle of my example, note in the console log the event has a data object which is undefined - How do I assign it?

Note: I am not using a event emitter but a native DOM event

Answer 1

I am not sure if I understood properly your use case, but if you want to add something to the event object passed by the listener, then just do it with a map :

clickStream = Rx.Observable.fromEvent(li, 'click').map(function (event){
  return {
    event : event,
    data : { src :  people[p].img }
  }
});

This in particular will be better than inserting directly the data property in the event. event should be inmutable.

Or you could use the selector overload (to test, never actually used that selector function):

clickStream = Rx.Observable.fromEvent(li, 'click', function (event){
  return {
    event : event,
    data : { src :  people[p].img }
  }
});