javascript - rxjs 合并在 Angular5 中无法按预期工作

Question

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/merge';

this.events = this.availableHoursCollection.valueChanges()
this.bla = this.afs.collection<AvailableHour>('users')
  .doc('G2loKLqNQJUQIsDmzSNahlopOyk1').collection('availableHours');

this.test = this.bla.valueChanges();


this.something = Observable.merge(
  this.events,
  this.test
)

this.something 只有最后一个可观察的项目，我如何组合它们？
另外，如果您有具有相同值 id 的可观察量，如何合并这些值？

Answer 1

使用 AngularFire 测试台，我运行了您的 Rx 场景

const merged = Observable.merge(o1, o2)

我得到了一个发出两次的可观察对象，每次发出都包含一个数组，该数组是每个查询的结果。

这让我想知道你是如何检查输出的。如果使用异步管道管道到模板 {{ results | async }}，那么第二个发出将覆盖第一个，并给人留下只有第二个发出的印象。

如果您很清楚这一点，我深表歉意。

如果您需要组合两个数组的单个发射，有多种方法可以实现。最适合这种情况的是 combineLatest()。

const combined = Observable.combineLatest(o1, o2)
  .map(([s1, s2]) => [...s1, ...s2])

这样做最好的原因是 .valueChanges() 旨在不断推送更改，因此它永远不会完成。因此基于 forkJoin() 或

的方法

Observable.merge(o1.mergeMap(x => x), o2.mergeMap(x => x)).toArray()

两者都需要 completed 事件来发出任何内容，而 combineLatest() 则不需要，并且只要其中一个源更新，组合的可观察值就会再次发出。