我正在使用 RXJS,并且希望动态过滤数据,但遇到问题:
let numberSource: ReplaySubject<Number> = new ReplaySubject<Number>();
let numberFilter: BehaviorSubject<Number> = new BehaviorSubject<Number>(5);
let filteredData = numberSource.filter(n => n < numberFilter.value);
numberFilter.subscribe(newFilter => {
filteredData = numberSource.filter(n => n < newFilter);
filteredData.subscribe(console.log); // <- I think this is wrong
});
console.log("A");
filteredData.subscribe(console.log);
numberSource.next(1);
numberSource.next(10);
numberSource.next(100);
console.log("B");
numberFilter.next(50);
我正在做的是订阅 numberSource,这是我有兴趣显示的数据。我还订阅了 numberFilter,因为我希望对其进行任何更改以重播该主题,但我认为我做错了。
我期待看到:
A
1
B
1
10
我看到:
A
1
1
B
1
10
有人可以帮忙吗?
我想我明白你想做什么。你想堆叠所有发出的值numberSource
能够重新发送并过滤它们numberFilter
变化。
您实施中的主要问题是numberFilter
is a BehaviorSubject
它发出默认值(5
在这种情况下)每次您订阅它时都会在线上发生numberFilter.subscribe(newFilter => ...
。该回调订阅filteredData
然后紧接着又console.log("A");
。所以你甚至还没有开始向numberSource
并且您已经订阅了两次。这就是为什么它给你1
两次。
简单的解决方案是使用经典Subject
并记住unsubscribe()
之前的订阅filteredData
:
let numberSource: ReplaySubject<Number> = new ReplaySubject<Number>();
let numberFilter: Subject<Number> = new Subject<Number>();
var subscription;
numberFilter.subscribe(newFilter => {
if (subscription) {
subscription.unsubscribe();
}
subscription = numberSource.filter(n => n < newFilter)
.subscribe(console.log);
});
numberFilter.next(5);
console.log("A");
numberSource.next(1);
numberSource.next(10);
numberSource.next(100);
console.log("B");
numberFilter.next(50);
观看现场演示:http://plnkr.co/edit/vOaD8tcWlLRdfzU14Ufw http://plnkr.co/edit/vOaD8tcWlLRdfzU14Ufw
现在它为您提供了您想要的输出。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)