遍历数组的元素和 return Observable

Question

我有一个 Observable，其中 User 有一个我想遍历的数组属性 Posts[]，调用一个具有中间值的方法，然后 return 一个 Observable 和结果对象作为数组。

目前我有以下有效的代码：

    public ngOnInit() {
    const results: any[] = [];
    this.controlData$ = this.controlContent$
        .pipe(
            filter((input) => input !== null),
            flatMap((p: IControlContentSection) => p.controlPerformers),
            map((m: IControlPerformer) => {
                results.push({
                        ...m,
                        nextOccurrence: this.getNextControlDate(m.controlFrequency, m.firstOccurrence),
                    });
                return results;
                }),
            takeUntil(this.destroy$),
            );
}

我使用数组变量 results: any[]，但我不喜欢这个解决方案，因为它依赖于这个外部变量，使其仅在组件初始化时工作。

我尝试在地图后使用 toArray() 或 reduce((x, y) => x.concat(y), [])，但随后在模板中解析为 null。

如何在不需要外部变量的情况下 return Observable？

在我通过异步管道订阅的模板中：

<div *ngIf="controlData$ | async as controllers">
  ...
  <div *ngFor="let ctrl of controllers; trackBy:ctrl?.userId">
  ...
  </div>
</div>

Answer 1

你在地图之后做的是正确的，它应该可以工作。但是要模拟您的确切行为，您需要一个扫描操作员。 scan 运算符将发出中间值，就像您返回结果数组一样。你试过这样吗？:

 public ngOnInit() {
    this.controlData$ = this.controlContent$
    .pipe(
        filter((input) => input !== null),
        flatMap((p: IControlContentSection) => p.controlPerformers),
        map((m: IControlPerformer) => {
            return {...m,
                    nextOccurrence: this.getNextControlDate(m.controlFrequency, m.firstOccurrence),
                };
         }),
         scan((acc, cur) => [...acc, cur], [])
         takeUntil(this.destroy$),
        );
}

应该可以，如果不行，我可以给你一个plunker之类的。

希望对您有所帮助。

遍历数组的元素和 return Observable

Iterate through elements and return Observable of array

arrays

observable

rxjs5

angular