RxJs как сопоставить предметы в Observable <Array>

Question

Я создал несколько упрощенных кодов, чтобы проиллюстрировать мою проблему.

Моя наблюдаемая испускает массив. Я пытаюсь отобразить элементы в массиве, но я вынужден использовать Array.map в операторе карты RxJS для достижения этой цели. Я ищу более RxJ способ достижения того же, что не использует Array.map. Вот stackblitz и вот основной код. Спасибо.

this.myObservable$ = of(json).pipe(
  map((data: any[]) => {
    return data.map((navigation: any) => {
      return <INavigation> {
        Id: navigation.Id,
        AppId: navigation.NavAppId,
        NavId: navigation.NavId,
        Name: navigation.NavName,
        ParentId: navigation.NavParentId,
        PageURL: navigation.NavPageURL,
        Position: navigation.NavPosition,
        Active: navigation.NavActive,
        Desktop: navigation.NavDesktop,
        Tablet: navigation.NavTablet,
        Phone: navigation.NavPhone,
        RoleId: navigation.NavRoleId,
        Target: navigation.NavTarget
      }
    })
  })
)

Answer 1

Если вы не хотите использовать метод map для массива, а только для операторов RxJS, вы можете использовать тот факт, что mergeMap требует в качестве параметра функции, которая возвращает ObservableInput, и что массив является ObservableInput.

В этом случае mergeMap делает выравнивание массива и испускание его отдельных элементов (mergeMap также известен как flatMap).

В конце, так как вам нужен массив, который будет выдан this.myObservable$, вы можете использовать оператор toArray.

код выглядит так

this.myObservable$ = of(json).pipe(
      mergeMap(data => data),
      map((navigation) => {
        return <INavigation> {
          Id: navigation.Id,
          AppId: navigation.NavAppId,
          NavId: navigation.NavId,
          Name: navigation.NavName,
          ParentId: navigation.NavParentId,
          PageURL: navigation.NavPageURL,
          Position: navigation.NavPosition,
          Active: navigation.NavActive,
          Desktop: navigation.NavDesktop,
          Tablet: navigation.NavTablet,
          Phone: navigation.NavPhone,
          RoleId: navigation.NavRoleId,
          Target: navigation.NavTarget
        }
      }),
      toArray()
    )

Честно говоря, ваше оригинальное решение с методом Array map выглядит проще и экономнее.

Answer 2

RxJS внутренне использует только функцию Javascript, каждый оператор является функцией javascript, и вы можете создать собственный оператор RxJS, используя функцию JS. преобразование и возврат наблюдаемого.

Вы можете использовать оператор карты Javascript, который хорош. Не вижу оператора Rxjs, специфичного для forEach.