Javascript 使用RxJs将多个回调返回映射为可观察的

我目前正在学习RxJs，并试图定义返回可观察对象的模块。（每个模块都像一个黑匣子，只暴露其可观察对象）。 我的主要问题是由于我使用的第三方库：UWA: 我的所有dom元素都是从UWA对象生成的，并触发UWA“事件”。 顺便说一句，我想将这些自定义事件映射到可观察对象。 以下是事件数据结构的一部分：

tabBar = *somecode*...{
....
  onEndEditTab: function (callback) {
    return this.modelEvent.subscribe({
      event: endEditTabEvent
    }, callback);
  },....
}

这是我目前的代码：

const tabBar = new tabBar();
tabBar.inject(domContainer);
const observer={
  next: (t) =>{
    const oldValue=t.target.textContent;
    const cbObservable = Rx.Observable.bindCallback(tabBar.onEndEditTab);
    //a new cbObservable is created at each dblclick event
    // (due to bindCallBack property which is to retern only one time.
    cbObservable .call(tabBar).subscribe(
      (v) => {
         console.log({oldLabel:oldValue,newLabel:v[0].button.label});
      }
    );          
Rx.Observable.fromEvent(tabBar, 'dblclick').subscribe(observer);

该代码在每次编辑选项卡标签时都会工作并记录新旧值。 但目前我想要的不是打印，而是将所有这些结果聚合到一个新的可观察流中。 使用大理石图：

dblclick : ----(1)----(2)---....(n)->

（其中存在未知数量的dblclick…） 映射到：

cbObservable : ----(1:{old,new})--|
               ----(2:{old,new})--| 
               ....
               ----(n:{old,new})--|

我现在想要的是：

outputStream : ----(1:{old,new})---(2:{old,new})--...(n:{old,new})--->

其中outputStream是热可观测的； 有没有一种方法可以在上述所有约束条件下实现这一点？ 谢谢大家!

尝试使用switchMap

Rx.Observable.fromEvent(tabBar, 'dblclick').switchMap(() => {
    const oldValue=t.target.textContent;
    return Rx.Observable.bindCallback(tabBar.onEndEditTab).map((v) => {
       return {old: oldValue, new: v[0]}
    });
})

或者类似的东西，然后对结果的可观察性进行单订阅

尝试使用switchMap

Rx.Observable.fromEvent(tabBar, 'dblclick').switchMap(() => {
    const oldValue=t.target.textContent;
    return Rx.Observable.bindCallback(tabBar.onEndEditTab).map((v) => {
       return {old: oldValue, new: v[0]}
    });
})

---

或者类似的事情，然后对生成的可观察结果进行单个订阅

@llCorvinuSll：感谢您的回答，经过一次简单的修改后，它开始工作了：

正在将调用（yourObject）添加到bindCallback！ bindCallback返回一个函数，因此需要调用它：

Rx.Observable.fromEvent(tabBar, 'dblclick').switchMap(() => {
    const oldValue=t.target.textContent;
    return Rx.Observable.bindCallback(tabBar.onEndEditTab).call(tabBar).map((v) => {
       return {old: oldValue, new: v[0]}
    });
})

---

@llCorvinuSll：感谢您的回答，经过一次简单的修改后，它开始工作了：

正在将调用（yourObject）添加到bindCallback！ bindCallback返回一个函数，因此需要调用它：

Rx.Observable.fromEvent(tabBar, 'dblclick').switchMap(() => {
    const oldValue=t.target.textContent;
    return Rx.Observable.bindCallback(tabBar.onEndEditTab).call(tabBar).map((v) => {
       return {old: oldValue, new: v[0]}
    });
})

---

根据定义：

bindCallback

不是运算符，因为它的输入和输出是不可*观察的。输入是一个带有一些参数的函数

func

，但*最后一个参数必须是一个回调函数，

func

在*完成时调用该函数。所以问题是，如何将这个输出转换成可观察的？根据定义：

bindCallback

不是运算符，因为它的输入和输出都不是*可观察的。输入是一个带有一些参数的函数

func

，但*最后一个参数必须是一个回调函数，

func

在*完成时调用该函数。所以问题是，如何将这个输出转换成一个可观察的？