Angular2 + ngrx/store : 루프 내에서 상태를 변경하는 방법은 무엇입니까?

Question

ngrx/store를 사용하는 Angular2 앱에서 API의 일부 데이터를 쿼리하고 저장소로 전달하는 메소드가 있습니다. 작동 중입니다. ok :

get(id: number) { 
    return this.http.get(`http://localhost:3000/contents/${id}.json`).map(response => { 
    return response.json(); 
    }) 
    .map((content: Content) => { 
    this.store.dispatch({ type: 'GET_CONTENT', payload: content }); 
    return content; 
    }); 
} 

API를 쿼리하는 다른 서비스가 있는데 배열 객체를 반환합니다. 이 경우, 다음과 같이 처리합니다.

return this.http.get(`http://localhost:3000/contents/${id}/contents.json`).map(response => { 
    return response.json(); 
}) 
.map((contents: Array<Content>) => { 
    contents.map(payload => { 
    this.store.dispatch({ type: 'GET_CONTENT', payload }); 
    }); 
    return contents; 
}) 

작동하지만 저장소 상태가 여러 번 변경됩니다. 더 나은 접근 방법이 있습니까? 어쩌면 매장의 모든 것을 동시에 처리하는 또 다른 액션 ('GET_CONTENTS')을 만들 수 있습니까? 또는 어떻게 든 'contents.map'이 끝난 후에 상태를 변경해야한다고 말할 수 있습니까?

Answer 1

간단한 해결책은 감속기를 편집하여 Array<Content> 페이로드를 기대하는 것입니다. 그런 다음, 하나의 Content의 경우 단지 배열에 그 값을 파견 :

이

this.store.dispatch({ type: 'GET_CONTENT', [content] });