.map로 관찰 가능 변환

Question

관찰 가능 객체를 변환하는 데 문제가 있습니다. 아래의 세부 사항 :

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

:이 구독하는 것을 시도하고, 그 다음

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

을 :

나는이

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

같은 데이터가 그럼 난 API에서이 데이터를 얻을 수 있습니다

그리고 괜찮습니다. 작동합니다. 하지만 객체의 구조를 수정해야하고 나는이 스키마에받은 객체를 변환하는 .MAP 사용하고 싶습니다 :

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

.. 나를 위해 일하는 아무것도 .. :/I가 없다하더라도 새 속성을 추가 할 수 있지만 예를 들어에 값을 수정 firstName을 '이 작동하지 않습니다

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

(타입'문자열 ''데이터 [] '내가 알고 그 의미 내용을 입력 할 할당 할 수없는,하지만 난 돈 어떻게 해야할지, 내 실수는 어디 있겠습니까?)

Answer 1

아래와 같이 해당 유형의 객체를 만들어야합니다.

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

Answer 2

배열에서 관찰 가능한의 지도 운영자 간의 차이 지도 연산자있다. HTTP 요청의 결과를 배열로 변환 한 다음 해당 배열의 모든 구성원에게 몇 가지 추가 변환을 적용하려고합니다.

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

각도의 Http 서비스 응답을 보유하는 Observable 개체를 반환합니다. 내부의 데이터를 활용하려면 응답의 json() 메소드를 호출해야합니다.

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

이 코드는 '관찰 일부 데이터를 전송할 때, HTTP 응답으로 취급하고 JSON, 다음 다른 관찰 가능한에 넣어 그 내용을 추출'을 의미한다. 그래서 구독한다면 배열을 얻을 수 있습니다. 지도 연산자를 사용하는 것과 같이 일반 배열을 사용하여 모든 작업을 수행 할 수 있습니다. 내 자신의 예를 사용하겠습니다. 귀하의 것과 매우 유사합니다.

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

연속 2 지도 : 그것이 당신에게 너무 장황 있다면

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