0

I want to run this example with rxjs5. But it doesn't work. I've stucked on #41 line. It says that map returns Subject and it doesn't have .takeUntil method. What is the best way to implement it? Thanks

4

2 回答 2

2

你的例子真的很老了，它使用的toRx()是很久以前被弃用和删除的东西。该示例还使用 EventEmitters 并订阅了它们，我们不应该这样做，它还使用 DOM 设置值nativeElement，我们也不应该这样做。

所以我稍微修改了这个例子

  • 我删除了 EventEmitter 并将其替换为 Subject
  • 已删除toRx()，不再需要
  • 使用渲染器设置元素的cursor和position。

这是目前代码的一小部分，并没有什么不同。

  constructor(public element: ElementRef, public renderer: Renderer) {
    this.renderer.setElementStyle(element.nativeElement, 'position', 'relative');
    this.renderer.setElementStyle(element.nativeElement, 'cursor', 'pointer');

    this.mousedrag = this.mousedown.map(event => {
        event.preventDefault();
        return {
          left: event.clientX - this.element.nativeElement.getBoundingClientRect().left,
          top:  event.clientY - this.element.nativeElement.getBoundingClientRect().top
        };
      })
      .flatMap(imageOffset => this.mousemove.map(pos => ({
        top:  pos.clientY - imageOffset.top,
        left: pos.clientX - imageOffset.left
      }))
      .takeUntil(this.mouseup));

  }

这是完整的示例。

于 2016-03-20T13:37:06.403 回答
0

从您的仓库看来，您使用的是旧版本的Angular2 packages.
但是你可以试试这个，或者Eric Martinez给了你很棒的工作演示。

导入'rxjs/Rx'；

于 2016-03-20T13:41:22.667 回答