Получить данные из Observable в Angular 7

Question

Я довольно новичок в Angular.Попытка получить данные следующим образом из конечной точки GET REST -

{"employees":[{"empId":"1","name":"emp1","designation":"manager","salary":3000.0},{"empId":"2","name":"emp2","designation":"developer","salary":3000.0}],"addresses":[{"city":"London"},{"city":"Belgium"}]}

. Имеет два списка сотрудников и адреса.В угловом я создал классы следующим образом -

export class Employee {

  constructor(

  ) { }
}

export class Address {

  constructor(

  ) { }
}



export class EmployeeDetail {
  public employees: Employee[];
  public addresses: Address[];

  constructor( ) { }
  public get employee(): Employee[] {
    return this.employees;
  }

  public get address(): Address[] {
    return this.addresses;
  }

  public set address(addresses: Address[]){
    this.addresses = addresses;
}

}

Пытаясь построить класс EmployeeDetail следующим образом -

getData() {
    return this.httpClient.get<EmployeeDetail>('http://localhost:8080/employees')
    .pipe(
      map(data => {
        const employeeList: Employee[] = [];
        const addressList: Address[] = [];
        var employeeDetail = new EmployeeDetail();
        const newList1 : Employee[] = data.employee;
        const newList2 : Address[] = data.address;
        console.log(newList1);
        newList1.forEach(item => 
          employeeList.push(Object.assign(new Employee(), item)));
        newList2.forEach(item => 
          newList.push(Object.assign(new Address(), item)));  
          employeeDetail.employee = employeeList;
          employeeDetail.address = addressList;


        return employeeDetail;
      })
   );

Получение следующего исключения

TypeError: Cannot read property 'forEach' of undefined
    at MapSubscriber.project (http-client.service.ts:119)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapSubscriber._next (map.js:35)
    at MapSubscriber.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)

Couldкто-нибудь, пожалуйста, помогите мне создать объект EmployeeDetail.Спасибо

Answer 1

На самом деле вам не нужно вводить всю эту избыточную логику в метод getData().

Как насчет упрощения вашей реализации, например:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

export class Employee {
  empId: string;
  name: string;
  designation: string;
  salary: number;
}

export class Address {
  city: string;
}

export class EmployeeDetail {
  employees: Employee[];
  addresses: Address[];
}

@Injectable()
export class EmployeeService {

  constructor(private http: HttpClient) {}

  getEmployeeData(): Observable < EmployeeDetail > {
    return this.http.get < EmployeeDetail > ('/assets/employees.json');
  }

}

---

Мыпросто укажите T метода get для HttpClient до EmployeeDetail и верните все, что возвращает этот метод.Это вернуло бы Observable обтекание значения типа EmployeeDetail.

---

Вот вам рабочий образец StackBlitz для вашей ссылки.