如何将多个主题合二为一并对每一个变化做出反应

Question

我目前正在构建一个步进组件，它在其 ng-content 中呈现了多个步进组件。在步进器组件中，我通过 ContentChildren 访问这些组件。每个步骤组件都有一个 Subject，它会在 Input 值更改时调用 .next()。我这样做是为了通知父级 (StepperComponent)，以便我可以为视图重新创建模型。首先，我在 foreach 循环中订阅了每个主题。我想知道是否可以将我所有的科目结合起来并订阅。因为我真的不在乎哪一步发生了变化，只想知道某个步骤发生了变化。我目前尝试使用 merge() 和 combineLatest() ，当其中一个主题调用 .next() 时，它们都没有触发。

这就是我最新使用合并和组合的方式

this.stepsOnChangeSubscription = merge(this.steps.map(s => s.onChanges$))
  .pipe(takeUntil(this.unsubscribe$)).subscribe(_ => this.createStepConfig());

this.stepsOnChangeSubscription = combineLatest(this.steps.map(s => s.onChanges$))
  .pipe(takeUntil(this.unsubscribe$)).subscribe(_ => this.createStepConfig());

步骤定义为

@ContentChildren(StepComponent) steps: QueryList<StepComponent>;

而$unsubscribe只是在ngOnDestroy中取消订阅

Answer 1

使用 combineLatest 时，您需要每个 Subject 在收到通知之前至少发出一次。

merge 是正确的选择，但它需要一个展开的数组（即 ...myArray）。

因此，以下内容应该有所帮助：

this.stepsOnChangeSubscription = merge(...this.steps.map(s => s.onChanges$))
  .pipe(takeUntil(this.unsubscribe$)).subscribe(_ => this.createStepConfig());

如何将多个主题合二为一并对每一个变化做出反应

How to combine multiple subjects into one and react to every change

angular

rxjs

combinelatest