Как взять тело из ответа, поступающего в консоль, и назначить его конкретным объектам в angular4

Question

У меня есть набор ссылок, мне нужно прочитать каждую ссылку и присвоить ее конкретному объекту.

TS:

exportUrl: any = {
    patient: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/Patient/Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    medication: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/MedicationOrder?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    condition: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/Condition?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    allergy: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/AllergyIntolerance?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    immunization: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/Immunization?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    diagnostic: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/DiagnosticReport?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    observation: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/Observation?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB&code=8310-5",
    procedure: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/Procedure?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    device: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/Device?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    careplan: "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/CarePlan?patient=Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB"
};
constructor(private http: Http) {}

ngOnInit() {
        this.http.get(this.exportUrl.patient).subscribe(data => {
            console.log('data', data);
        })

Здесь я нев состоянии получить data._body выдает ошибку в коде

Рабочая ссылка:

https://stackblitz.com/edit/angular-z9vwzq?file=src/app/app.component.ts

Консоль:

{
    "resourceType": "Patient",
    "birthDate": "1985-08-01",
    "active": true,
    "gender": "male",
    "deceasedBoolean": false,
    "id": "Tbt3KuCY0B5PSrJvCu2j-PlK.aiHsu2xUjUM8bWpetXoB",
    "careProvider": [{
        "display": "Physician Family Medicine",
        "reference": "https://open-ic.epic.com/FHIR/api/FHIR/DSTU2/Practitioner/T3Mz3KLBDVXXgaRoee3EKAAB"
    }],
    "name": [{
        "use": "usual",
        "text": "Jason Argonaut",
        "family": ["Argonaut"],
        "given": ["Jason"]
    }],
    "identifier": [{
        "use": "usual",
        "system": "urn:oid:1.2.840.114350.1.13.327.1.7.5.737384.0",
        "value": "E3826"
    }, {
        "use": "usual",
        "system": "urn:oid:1.2.3.4",
        "value": "203579"
    }],
    "address": [{
        "use": "home",
        "line": ["1979 Milky Way Dr."],
        "city": "Verona",
        "state": "WI",
        "postalCode": "53593",
        "country": "US"
    }, {
        "use": "temp",
        "line": ["5301 Tokay Blvd"],
        "city": "MADISON",
        "state": "WI",
        "postalCode": "53711",
        "country": "US",
        "period": {
            "start": "2011-08-04T00:00:00Z",
            "end": "2014-08-04T00:00:00Z"
        }
    }],
    "telecom": [{
        "system": "phone",
        "value": "608-271-9000",
        "use": "home"
    }, {
        "system": "phone",
        "value": "608-771-9000",
        "use": "work"
    }, {
        "system": "phone",
        "value": "608-771-9000",
        "use": "mobile"
    }, {
        "system": "fax",
        "value": "608-771-9000",
        "use": "home"
    }, {
        "system": "phone",
        "value": "608-771-9000",
        "use": "temp",
        "period": {
            "start": "2011-08-04T00:00:00Z",
            "end": "2014-08-04T00:00:00Z"
        }
    }, {
        "system": "email",
        "value": "open@epic.com"
    }],
    "maritalStatus": {
        "text": "Single",
        "coding": [{
            "system": "http://hl7.org/fhir/ValueSet/marital-status",
            "code": "S",
            "display": "Never Married"
        }]
    },
    "communication": [{
        "preferred": true,
        "language": {
            "text": "English",
            "coding": [{
                "system": "urn:oid:2.16.840.1.113883.6.99",
                "code": "en",
                "display": "English"
            }]
        }
    }],
    "extension": [{
        "url": "http://hl7.org/fhir/StructureDefinition/us-core-race",
        "valueCodeableConcept": {
            "text": "Asian",
            "coding": [{
                "system": "2.16.840.1.113883.5.104",
                "code": "2028-9",
                "display": "Asian"
            }]
        }
    }, {
        "url": "http://hl7.org/fhir/StructureDefinition/us-core-ethnicity",
        "valueCodeableConcept": {
            "text": "Not Hispanic or Latino",
            "coding": [{
                "system": "2.16.840.1.113883.5.50",
                "code": "2186-5",
                "display": "Not Hispanic or Latino"
            }]
        }
    }, {
        "url": "http://hl7.org/fhir/StructureDefinition/us-core-birth-sex",
        "valueCodeableConcept": {
            "text": "Male",
            "coding": [{
                "system": "http://hl7.org/fhir/v3/AdministrativeGender",
                "code": "M",
                "display": "Male"
            }]
        }
    }]
}

Answer 1

Перед объяснением решения вы используете угловой 4 с Http.Http устарела в угловых 4 в пользу HttpClient.Сначала вам нужно обновить определение модуля.

import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';

// Import HttpClientModule from @angular/common/http
import {HttpClientModule} from '@angular/common/http';

@NgModule({
  imports: [
    BrowserModule,
    // Include it under 'imports' in your application module
    // after BrowserModule.
    HttpClientModule, // <- not HttpModule
  ],
})
export class MyAppModule {}

Затем вам нужно будет ввести HttpClient вместо Http

constructor(private http: HttpClient) {}

Затем вы можете сделать:

this.http.get(this.exportUrl.patient).subscribe(data => {
  // Read the result field from the JSON response.
    console.log(data['resourceType']); // should log Patient
});

Но лучшее, что нужно сделать, это использовать ответ проверки типа.Сначала вам нужно создать интерфейс, представляющий вас в формате JSON, например:

export interface Patient {
    active: boolean;
    resourceType: string;
    // ...
}

и обновить код до:

this.http.get<Patient>(this.exportUrl.patient).subscribe(data => {
    console.log(data.resourceType); // should log Patient
});

Затем, для соблюдения хорошей практики, компонент не должен обращаться к HttpClient, но онследует запрашивать данные через Сервис

Answer 2

Вы можете преобразовать тело ответа в строку с text () и присвоить ее любому:

ngOnInit() {
  this.http.get(this.exportUrl.patient).subscribe(data => {
      let body = data.text();
})

Answer 3

Если вы хотите получить данные в формате json, вы можете использовать data.json()

  ngOnInit() {
    this.http.get(this.exportUrl.patient).subscribe(data => {
      console.log('data', data.json());
  })

Рабочий пример здесь - https://stackblitz.com/edit/angular-knd3cq

Answer 4

Вы можете использовать текстовый метод, чтобы получить текст ответа в виде:

data.text()

и если вы хотите получить тело ответа в json, используйте метод json, например:

data.json()

ngOnInit() {
        this.http.get(this.exportUrl.patient).subscribe(data => {
            console.log(data.text());
console.log(data.json());
        })