Angular 5 可观察映射到 Json 数组

Question

我的后端返回这个：

{
"FirstResponse": [
{
"MyField1": "AAA",
"MyField2": "AAAAAAA"
},
{
"MyField1": "BBB",
"MyField2": "BBBBBBB"
},
{
"MyField1": "CCC",
"MyField2": "CCCCC"
}
],
"SecondResponse": [
{
"FirstName": "FirstNameA",
"LastName": "LastNameA"
},
{
"FirstName": "FirstNameB",
"LastName": "LastNameB"
}
]   
}

我想将FirstReponse映射到一个变量，SecondResponse映射到另一个变量。

如何调整下面的代码？

search(): Observable<any> {
let apiURL = `......`;
return this.http.get(apiURL) 
.map(res => res.json())
}

更新：例外结果 在一个变量中，这个：

[
{
"MyField1": "AAA",
"MyField2": "AAAAAAA"
},  
{
"MyField1": "BBB",
"MyField2": "BBBBBBB"
},
{
"MyField1": "CCC",
"MyField2": "CCCCC"
}
]

一秒钟内：

[
{
"FirstName": "FirstNameA",
"LastName": "LastNameA"
},
{
"FirstName": "FirstNameB",
"LastName": "LastNameB"
}
]

Answer 1

您可以创建一个导出模型类的新文件，然后将其分配给返回的可观察类型。像这样：

新模型.ts 文件

class FieldModel {
Field1: string;
Field1: string;
}
export class valuesModel {
MyValues: Array<FieldModel>;
}

在服务上。

import { valuesModel } from 'model';
search(): Observable<valuesModel> {
let apiURL = `https://jsonplaceholder.typicode.com/users`;
return this.http.get(apiURL) 
.map(res => res.json())
}

Answer 2

请检查此方法，请使用import { Http, Response} from '@angular/http'; import { Observable } from 'rxjs/Observable';

public search(){
let apiURL = `https://jsonplaceholder.typicode.com/users`;
return this.http.get(apiURL) 
.map((res: Response)=> return res.json();)
.catch((error: Response) => {
return Observable.throw('Something went wrong');   
});
}

对于此search()方法，您可以从组件订阅。

如果您想将输出映射到受人尊敬的模态，请提供相同的格式。这样我就可以帮忙

Answer 3

我不明白你想要得到什么，因为你没有提供示例结果，

但是试试这个 - 更改行：

.map(res => res.json())

自

.map(res => res.json().MyValues )

使用它，您将在顶级获得类似的数组，就像您在下面的评论中提供的链接一样，您质疑：https://jsonplaceholder.typicode.com/users

更新(问题更新后 9.10.2018)

当前.map(res => res.json())返回具有两个字段(变量)"FirstResponse"和"SecondResponse"的对象。例如，您可以访问它(我从head编写代码)：

public async loadData() 
{
let data  = await this.yourService.search().toPromise();
let firstVariable = data.FirstResponse;
let secondVariable = data.SecondResponse;     
...
}

因此，正如您在 loadData() 中的问题/评论中所描述的那样，您可以根据需要获得两个变量的结果。

或者替代答案 - 如果你想在 search() 中执行此操作，那么你可以这样做，例如：

search(): Observable<any> {
let apiURL = `......`;
return this.http.get(apiURL) 
.map( (res) => { 
let data = res.json();
return {
firstVariable: data.FirstResponse,
secondVariable: data.SecondResponse,  
}
})
}