在 JavaScript 中订阅地图数据结构不起作用

Question

我一直试图在 JavaScript 中观察地图对象的变化，但由于某种原因只能观察对象的创建。从地图中添加/删除数据时，可观察对象是否不起作用？

这是可观察的：

  test(): Observable<Map<string, Object>> {
    return of(this.testModel.test());
}

这是我订阅的：

test(): Observable<Map<string, Object>> {

let mapOb = this.testModel.test();
    return Observable.create((obsrvr) => {
      const originalSet = mapOb.set;
      const originalDelete = mapOb.delete;
      mapOb.set = (...args) => {
        obsrvr.next(originalSet.call(mapOb, ...args));
      };

      mapOb.delete = (...args) => {
        obsrvr.next(originalDelete.call(mapOb, ...args));
      }
    });
}

我在地图创建过程中看到了日志语句，但如果我向地图添加任何新条目，则不会记录任何内容。有人知道为什么会这样吗？

我在 maoOb.set 和 mapOb.delete 处收到错误：

Type '(key: string, value: Object) => void' is not assignable to type '(key: string, value: Object) => Map<string, Object>'.
  Type 'void' is not assignable to type 'Map<string, Object>'

Answer 1

当您想收听地图中数据的添加/删除时，您当前的方法似乎不正确。

您只是使用of(Object Reference) 返回一个 Observable，这将无法知道您对传递给它的 Object 所做的事情。

您需要有一个 Observable，当您在 MapInstance 上执行 set() 或 delete() 时会发出。

您可以通过这种方式修改您的 Map 实例以实现您想要的。

createObservable(mapOb) {
  return Observable.create((obsrvr) => {
    const originalSet = mapOb.set;
    const originalDelete = mapOb.delete;
    mapOb.set = (...args) => {
      const setReturn = originalSet.call(mapOb, ...args);
      obsrvr.next(setReturn);
      return setReturn;
    };

    mapOb.delete = (...args) => {
      const deleteReturn = originalDelete.call(mapOb, ...args);
      obsrvr.next(deleteReturn);
      return deleteReturn;
    }
  });

}

将地图传递给 createObservable() 方法并订阅它。在这个方法中，我修改了您地图的set 和delete 方法，以便在调用这些方法时发出一个值。

我为答案创建了一个虚拟示例：Link.