javascript - 使用 Rxjs 的 `takeUntil` 自动取消订阅 - 无需等待发射？

Question

我已经读过 Ben 的 article关于通过 、 takeUntil 、 takeWhile 取消订阅(谓词版本)

I've used it like this example in my Angular app

但是有一点我不明白。

假设我有一个 Observable，它会在很长一段时间后发出值:

const source = Rx.Observable.interval(10000);

var isContinue=true;

const example = source.takeWhile(val => isContinue)
                      .subscribe(val => {},()=>{},()=>console.log('complete'));

setTimeout(function (){isContinue=false},3000) //somewhere in destructor

嗯，这只会在 10 秒后而不是 3 秒后显示“完成”。

所以基本上，如果我有一个订阅 Observable 的组件，并且该 observable 长时间不发出值，它仍然会引用我的对象，从而导致缓慢的内存泄漏。

问题:

如何在设置后立即使用 takeWhile 运算符取消订阅 isContinue 值。

我不想信任可能不会发出值的服务并保留对我的组件的引用。

JSBIN

Answer 1

我相信您的代码会产生正确的排放 - 但您关心的是完成的及时性(它应该在 3 秒后完成，而不是 10 秒)。

它需要 10 秒，因为 takeWhile 仅在源 observable 发出时测试其谓词。

takeUntil 将解决这个问题，但它需要一个可观察的对象来等待:

const source = Rx.Observable.interval(10000);

const abort = new Subject();

const example = source.takeUntil(abort)
                      .subscribe(val=>{}, ()=>{}, ()=>console.log('complete'));

setTimeout(function () {abort.next()}, 3000) //somewhere in destructor