如何从控制台中的响应中获取body,并将其分配给angular4中的特定对象



我有一组链接,我需要读取每个链接并分配给它的特定对象。

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);
})

在这里我无法获取数据_正文它在代码中抛出错误

工作环节:

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"
}]
}
}]
}

您可以使用text方法获取文本中的响应正文,如:

data.text()

如果你想要json中的响应体,那么使用json方法,比如:

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

您可以使用text((将响应的主体转换为字符串,并将其分配给任意对象:

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

如果您想获得json格式的数据,那么您可以使用data.json()

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

工作示例如下-https://stackblitz.com/edit/angular-knd3cq

在解释解决方案之前,您将使用带Http的angular 4。Http在angular 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,而是应该通过服务请求数据

最新更新