拨开荷叶行,寻梦已然成。仙女莲花里,翩翩白鹭情。
IMG-LOGO
主页 文章列表 一一观察RxJS

一一观察RxJS

白鹭 - 2022-03-15 2099 0 0

我有一个可观察的问题。我准备了stackblitz来简化我的问题。

我有 2 个 observables (obs1$, obs2$) 和数字阵列。我想等待 obs1$ 完成,然后回圈遍历阵列并回传每个元素的 observable,运行 obs2$。

下面是函式代码:

oneByOneObservables(): Observable<unknown> {
  const obs1$ = of(1, 2, 3);
  const arr = [4, 5, 6];
  const obs2$ = of(7, 8, 9);

  return obs1$.pipe(
    concat(() => arr.map((item) => of(item))),
    () => obs2$
  );
}

我有一个错误:

感谢帮助

uj5u.com热心网友回复:

所以这将奏效。我添加了一些日志来跟踪它。

这里也是Stackblitz

import { Component } from '@angular/core';
import { ChangeDetectionStrategy } from '@angular/core';
import { Observable, of, forkJoin } from 'rxjs';
import { concatMap, tap, last } from 'rxjs/operators';

@Component({
  selector: 'my-app',
  styleUrls: ['./app.component.scss'],
  templateUrl: './app.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class AppComponent {
  oneByOneObservables(): Observable<unknown> {
    const obs1$ = of(1, 2, 3).pipe(tap((v) => console.log('Obs1', v)));
    const arr = [4, 5, 6];
    const obs2$ = of(7, 8, 9);

    return obs1$.pipe(
      last(),
      tap((v) => console.log('Obs1 last value', v)),
      concatMap(() => forkJoin(arr.map((item) => of(item)))),
      tap((v) => console.log('Array of observables value', v)),
      concatMap(() => obs2$),
      tap((v) => console.log('Obs2 value', v))
    );
  }
}

uj5u.com热心网友回复:

继承人一些代码:

  • 等待 obs1$ 完成 ?
  • 然后回圈遍历阵列并回传每个元素的 observable ? (目前这是一个浪费几个 cpu 周期的 noop。创建一个 observable 并没有做任何事情,你打算订阅这些吗?按顺序?一次性?由你决定, 我猜)
  • 运行 obs2$ ?
function oneByOneObservables(): Observable<number> {
  const obs1$ = of(1, 2, 3);
  const arr = [4, 5, 6];
  const obs2$ = of(7, 8, 9);

  return obs1$.pipe(
    concatWith(defer(() => {
      arr.map((item) => of(item))
      return obs2$
    }))
  );
}

oneByOneObservables().subscribe(console.log);

输出:

1
2
3
7
8
9

一个又一个订阅可观察物件阵列的示例。

function oneByOneObservables(): Observable<number> {
  const obs1$ = of(1, 2, 3);
  const arr = [4, 5, 6];
  const obs2$ = of(7, 8, 9);

  return obs1$.pipe(
    concatWith(defer(() => 
      concat(...arr.map((item) => of(item)))
    )),
    concatWith(obs2$)
  );
}

oneByOneObservables().subscribe(console.log)

输出:

1
2
3
4
5
6
7
8
9

uj5u.com热心网友回复:

你可以用switchMap吗?虽然我不确定您正在寻找的可观察量的输出是什么。

oneByOneObservables(): Observable<unknown> {
  const obs1$ = of(1, 2, 3);
  const arr = [4, 5, 6];
  const obs2$ = of(7, 8, 9);

  return obs1$.pipe(
    concat(() => arr.map((item) => of(item))),
    switchMap(() => obs2$)
  );
}
标签:

0 评论

发表评论

您的电子邮件地址不会被公开。 必填的字段已做标记 *