У меня есть блок кода, который отвечает за принятие Observable<string[]>, затем сопоставление его с Observable<string> и выдачу значений на 1 секунду друг от друга.

Думайте об этом как о бегущей строке сообщения на веб-сайте.

Мой текущий код работает ниже:

    const arrayOfStrings$ = of([
        'Warming things up',
        'Getting things ready',
        'Welcome'
    ]);

    this.messages$ = arrayOfStrings$.pipe(
        switchMap((messages) => from(messages).pipe(
            concatMap((innerMessage) => of(innerMessage).pipe(delay(1000))),
        )),
        tap((message) => {
            console.log(`Message: ${message}`);
        })
    );

Есть ли лучший способ сделать это с меньшим количеством кода? Меня беспокоит в основном switchMap() и concatMap() внутри друг друга.

Спасибо за любую помощь и предложения.

Изменить: это упрощенная версия того, что я использовал в своем реальном проекте. Я просто пытаюсь найти более простой способ перейти от Observable к Observable и отложить каждую эмиссию на одну секунду после каждой эмиссии

1
Damian C 1 Июл 2021 в 21:04

3 ответа

Лучший ответ

Вы можете сначала сгладить массив, а затем задерживать каждое излучение, используя concatMap(), который будет гарантировать, что сообщения будут отправляться одно за другим.

const arrayOfStrings$ = of([
  'Warming things up',
  'Getting things ready',
  'Welcome'
]);

arrayOfStrings$
  .pipe(
    concatAll(), // flatten the array into individual next notifications
    concatMap(message => of(message).pipe(
      delay(1000),
    )),
  )
  .subscribe();
1
martin 1 Июл 2021 в 19:41
of('one', 'two', 'three')
  .pipe(zipWith(interval(1000)))
  .subscribe(console.log)

Или если вы хотите начать немедленно, замените интервал на

timer(0, 1000)
1
Yuriy Naydenov 1 Июл 2021 в 19:44

Я бы использовал следующий код:

const arrayOfStrings$ = of([
  'Warming things up',
  'Getting things ready',
  'Welcome'
]);

arrayOfStrings$.pipe(
  mergeMap((a) => a),
  zip(timer(1000, 1000)),
  map(([a]) => a),
  tap(message => {
    console.log(`Message: ${message}`);
  })
);
0
Harald Gliebe 1 Июл 2021 в 19:24