Question

我在改变我的observable方面遇到了问题。详情如下：

我有这样的数据

[
    {
      'firstName': 'John',
      'lastName': 'Cash',
      'age': 20
    }
  ];

然后我从api获得这些数据：

  public getData(): Observable<Data[]> {
    return this.http.get('xxx')
    .map(
      response => response.json()
    );
  }

然后，我试图订阅这个：

this.service.getData.subscribe(
        (res) => this.data = res
      );

没关系，它正在发挥作用。但是我需要修改对象的结构，我想使用.map将接收到的对象转换为这个模式：

[
    {
      'firstName': 'John',
      'lastName': 'Cash',
      'age': 20,
'newProperty': 'value'
    }
  ];

..并没有为我工作..：/即使我不想添加新属性，但修改一个值，例如firstName：

  .map(
    return x => x[0].firstName = 'asd'
  )

它不能正常工作（类型＆＃39;字符串＆＃39;不能分配到＆＃39;数据[]＆＃39;，我知道这意味着什么，但我不知道知道怎么做，我的错误在哪里？）

Answer 1

Observable中的 map 运算符和数组中的 map 运算符之间存在差异。您希望将HTTP请求的结果转换为数组，然后对该数组的每个成员应用一些额外的转换。

this.http.get('...')

返回Observable对象，该对象包含angular的Http服务的Response。要使用其中的数据，您必须调用Response的 json（）方法。

.map((response:Response) => response.json())

此代码表示＆＃39;当observable发送一些数据时，将其视为HTTP响应并将其内容提取为JSON，然后放入另一个Observable＆＃39;。因此，如果您订阅它，您将获得您的阵列。您可以使用常规数组执行任何操作，例如使用 map 运算符。让我使用我自己的例子，虽然它与你的非常相似。

this.http.get('...')
.map((response:Response) => response.json())
.subscribe((array:Person[]) => {
     let modifiedArray = array.map((item:any) => {
           item.newProperty = 'value';
     }

     this.persons = modifiedArray;
});

或者，如果您愿意，请在订阅之前操作数组项：

let modifiedData$:Observable<Person> = this.http.get('...')
.map((response:Response) => response.json())
.map((array:Person[]) => {
     return array.map((item:Person) => {
           item.newProperty = 'value';
     }
};

不需要两个连续的 map 运算符：

let modifiedData$:Observable<Person[]> = this.http.get('...')
.map((response:Response) => {
     return response.json().map((item:Person) => {
           item.newProperty = 'value';
     }
};

modifiedData$.subscribe((persons:Person[]) => {
     this.persons = modifiedArray;
});

如果它对你来说过于冗长，那么这里的版本更为紧凑（但不太可读）：

this.http.get('...')
.map(response => response.json().map(item => item.newProperty = 'value'))
.subscribe(persons => this.persons = persons);

Answer 2

您必须创建该类型的对象，例如，如下所示

.map((res: Response) => res.json().map(obj => new MyObject(obj.id, obj.name)))

使用.map转换Observable

2 个答案: