Angular наблюдаемый, как перебирать объект с вложенным массивом для сбора полей в массив - PullRequest
Новая
       15

Angular наблюдаемый, как перебирать объект с вложенным массивом для сбора полей в массив

0 голосов
/ 20 января 2020

Я пытаюсь go через мой JSON объект и добавить определенные c поля в их собственный массив.

Я пытаюсь перебрать объект ниже и сохранить 'appSupportedId' в свой собственный массив.

Я получаю ОШИБКУ

ОШИБКА 

 core.js:15714 ERROR TypeError: info.flatMap is not a function

Я реализовал нечто подобное в моем коде, но единственная разница с бэкэндом json объект в том, что этот объект ниже имеет вложенный массив

Любая помощь будет принята!

component.ts 

userAppDetails:[];

this.incidentService.get(this.id)
  .subscribe((info) => 
    this.userAppDetails = (info.flatMap(x => x.applicationsSupported)).contactAll().map(y=> y.appSupportedId))

JSON ОБЪЕКТ 

 "incidentNumber": 18817,
 "Email": null,
 "applicationsSupported": [
    {
        "appSupportedId": 18569,           
        "supportAreaId": 122,
        "supportAreas": {
            "applicationId": 122,               
            "activeFlag": "Y",
        },
        "appSupportedName": "app 1"
    },
    {
        "appSupportedId": 18592,          
        "supportAreaId": 123,
        "supportAreas": {
            "applicationId": 123,
            "activeFlag": "Y",
        },
        "appSupportedName": "app 2"
    },
    {
        "appSupportedId": 18655,
        "supportAreaId": 122,
        "supportAreas": {
            "applicationId": 122,
            "activeFlag": "Y",
        },
        "appSupportedName": "app 3"
    }
],
"createdDate": "2020-01-17T18:02:51.000+0000",

1 Ответ

2 голосов
/ 20 января 2020

Вы, кажется, смешиваете наблюдаемые операторы канала (внутри канала перед подпиской) с объектными операторами (в рамках подписки).

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

flatMap

concatAll

Ниже (https://stackblitz.com/edit/rxjs-d9nchy) приведен пример использования оператора map Rx JS. обратите внимание, что это отличается от оператора карты массива: 

import { of } from 'rxjs'; 
import { map } from 'rxjs/operators';

const DATA = {
  "incidentNumber": 18817,
  "Email": null,
  "applicationsSupported": [
      {
          "appSupportedId": 18569,           
          "supportAreaId": 122,
          "supportAreas": {
              "applicationId": 122,               
              "activeFlag": "Y",
          },
          "appSupportedName": "app 1"
      },
      {
          "appSupportedId": 18592,          
          "supportAreaId": 123,
          "supportAreas": {
              "applicationId": 123,
              "activeFlag": "Y",
          },
          "appSupportedName": "app 2"
      },
      {
          "appSupportedId": 18655,
          "supportAreaId": 122,
          "supportAreas": {
              "applicationId": 122,
              "activeFlag": "Y",
          },
          "appSupportedName": "app 3"
      }
  ],
  "createdDate": "2020-01-17T18:02:51.000+0000",
}
const source = of(DATA).pipe(
  map(x => x.applicationsSupported),
  map(arr => arr.map(entry => entry.appSupportedId))
);

source.subscribe(x => console.log(x));
...