Как распарсить Json?

Question

[Doil7727]

[
  {
    "general": {
      "firstName": "Liana",
      "lastName": "Crooks",
      "avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/kevinoh/128.jpg"
    },
    "job": {
      "company": "Ledner, Johnson and Predovic",
      "title": "Investor Functionality Coordinator"
    },
    "contact": {
      "email": "[e-mail]",
      "phone": "[phone]"
    },
    "address": {
      "street": "1520 Zemlak Cove",
      "city": "New Devon",
      "zipCode": "42586-7898",
      "country": "Guinea-Bissau"
    }
  },
  {
    "general": {
      "firstName": "Deontae",
      "lastName": "Dare",
      "avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/andysolomon/128.jpg"
    },
    "job": {
      "company": "D'Amore, Dicki and Borer",
      "title": "International Applications Consultant"
    },
    "contact": {
      "email": "[e-mail]",
      "phone": "1-615-843-3426 x600"
    },
    "address": {
      "street": "65901 Glover Terrace",
      "city": "Alden ton",
      "zipCode": "57744-4248",
      "country": "Kenya"
    }
  }
]

Пытаюсь парсить вот так:

getPeople() {
    return this.http.get('http://localhost:3000/global');
  }

в ответ получаю вот это
Observable {_isScalar: false, source: Observable, operator: MapOperator}
operator
:
MapOperator {project: ƒ, thisArg: undefined}
source
:
Observable {_isScalar: false, source: Observable, operator: FilterOperator}
_isScalar
:
false
__proto__
:
Object

Подскажите как правильно его распарсить!
Спасибо!

Answer 1

[Дмитрий Еремин]

Вам возвращается Observable - нужно подписываться (subscribe)
Типа
getPeople().subscribe(data => console.log(data))

потратьте время - пройдите https://angular.io/tutorial - базовые вопросы отпадут сами

Comments

[Doil7727]

Спасибо помогло!
До этого так делал, но чет не получалось!
Подскажите а как правильно мне теперь записать это в такой вид

class FullModel {
  constructor(
    public firstName: string,
    public lastName: string,
    public avatar: string,
    public company: string,
    public title: string,
    public email: string,
    public phone: string,
    public street: string,
    public city: string,
    public zipCode: string,
    public country: string,
    public id?: number
  ) {

[Дмитрий Еремин]

опять же - пройдите туториал (https://angular.io/tutorial/toh-pt6#httpclientget-...

getPeople() : Observable<FullModel[]>{
   return this.http.get<FullModel[]>('http://localhost:3000/global')   
}

myArr: FullModel[];

getPeople().subscribe(data => myArr = data )

[Doil7727]

Я сморил и впринципе по нему и делаю! Только там все показано с простыми примерами!
Как вы написали я тоже делал!
такая вот получается фигня:
когда пытаюсь обратится к переменной {{member.firstName}}
оно его не видит! я так понимаю мне через цикл теперь отдельно нужно вытащить еще остальный переменные по ключу?

[Дмитрий Еремин]

я не знаю, что такое member - откуда он берется? как присваивается значение? где код?
"оно его не видит!" - что это значит? где текст ошибки?

[Doil7727]

export class ListPeopleComponent implements OnInit {

  @Input()
  member:FullModel
  search='';
  constructor(private peopleService:PeopleService) { }

  ngOnInit() {
     this.peopleService.getPeople().subscribe(data =>
     {
       this.member=data;
       console.log(this.member)
     });
  }

export class FullModel {
    constructor(
      public firstName: string,
      public lastName: string,
      public avatar: string,
      public company: string,
      public title: string,
      public email: string,
      public phone: string,
      public street: string,
      public city: string,
      public zipCode: string,
      public country: string,
      public id?: number
    ) {
  }
}

Мой html! тупо вывод даных для проверки
<h1>{{member.firstNam}}</h1>
Error:
ERROR TypeError: Cannot read property 'firstName' of undefined
at Object.eval [as updateRenderer] (ListPeopleComponent.html:4)
at Object.debugUpdateRenderer [as updateRenderer] (core.js:11088)
at checkAndUpdateView (core.js:10464)
at callViewAction (core.js:10700)
at execComponentViewsAction (core.js:10642)
at checkAndUpdateView (core.js:10465)
at callViewAction (core.js:10700)
at execComponentViewsAction (core.js:10642)
at checkAndUpdateView (core.js:10465)
at callWithDebugContext (core.js:11352)

[Дмитрий Еремин]

Doil7727, ничего не понятно

в ответ на запрос GET возвращает массив?
в коде вижу
member:FullModel

this.peopleService.getPeople().subscribe(data =>
{
this.member=data;
console.log(this.member)
});

[Doil7727]

да массив многомерный!

Мой github c проектом
https://github.com/Felino7727/incode7727
Я так понимаю его нужно как-то вытянуть с массива теперь?

[Doil7727]

this.peopleService.getPeople().subscribe(data =>
{
forEach(data,(row)=>{console.log(row[0])})
console.log()
});

Решил пройти forEach теперь выкидует ошибку
Module not found: Error: Can't resolve '@angular/router/src/utils/collection' in 'D:\WebProject\incode\src\app\list-people'

[Doil7727]

@Input()
  member:FullModel[]
  data1:any
  search='';
  constructor(private peopleService:PeopleService) { }

  ngOnInit() {
     this.peopleService.getPeople().subscribe(data =>
     {
       this.data1=data;
       
       for(let i in this.data1) {
         this.member[i].firstName= this.data1[i].general.firstName;
         this.member[i].lastName= this.data1[i].general.lastName;
         this.member[i].avatar= this.data1[i].general.avatar;
         this.member[i].company= this.data1[i].job.company;
         this.member[i].title= this.data1[i].job.title;
         this.member[i].email= this.data1[i].contact.email;
         this.member[i].phone= this.data1[i].contact.phone;
         this.member[i].street= this.data1[i].address.street;
         this.member[i].city= this.data1[i].address.city;
         this.member[i].zipCode= this.data1[i].address.zipCode;
         this.member[i].country= this.data1[i].address.country;
       }
       console.log(this.member)
     });

Реализовал пока что так!
Но я подправил правда JSON файл!
В отдельности каждый атрибут в консоль выводится! но при записи в member выкидует ошибку:
ERROR TypeError: Cannot set property 'firstName' of undefined
at SafeSubscriber._next (list-people.component.ts:25)
at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:195)
at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (Subscriber.js:133)
at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next (Subscriber.js:77)
at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapSubscriber._next (map.js:41)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/operators/filter.js.FilterSubscriber._next (filter.js:38)
at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber.notifyNext (mergeMap.js:79)
Подскажите на что обратить внимание?
Спасибо