Question

在我的Angular 2应用程序中，我试图实现ngrx，所以我在我的一个组件中有这段代码：

OnInit() {
 this.myService.getApplicationList();
}

该服务返回此json：

{
 Count : 25, // count of all applications
 Applications[Array] // array with applications objects in it
 Categories[Array] // array of categories
}

如何只使用一个请求将计数，应用程序和类别分配给各自的reducer？

我现在正在做的是将响应对象映射到response.json（）。然后应用程序。

Myservice.ts

 getApplicationList(limit: number) {
    return this.http.get(this.baseUrl)
    .map(res => res.json().Applications )
    .map(payload => ({ type: 'GET_APP', payload : payload }))
    .subscribe(action => {
        this.store.dispatch(action)});
}

为了获得我以前做同样要求的类别：

    getApplicationList(limit: number) {
    return this.http.get(this.baseUrl)
    .map(res => res.json().Categories)
    .map(payload => ({ type: 'GET_CATEGORIES', payload : payload }))
    .subscribe(action => {
        this.store.dispatch(action)});
}

如何简化此重复并仅使用一个http请求映射我的Applicaitons和Categories数组？

Answer 1

您可以在订阅功能中处理这两种情况。

getApplicationList(limit: number) {
    return this.http.get(this.baseUrl)
    .map(res => res.json())
    .subscribe(res => {
        this.store.dispatch({ type: 'GET_CATEGORIES', payload : res.Categories });
        this.store.dispatch({ type: 'GET_APP', payload : res.Applications });
    });
}

Answer 2

我认为更正确的方法是使用ngrx @Effect（https://github.com/ngrx/effects）;

使用两个属性设置一个名为AppState的状态;类别＆amp;应用。
创建一个类似'LOAD_APP'的动作，效果应该侦听动作，然后一旦触发，将触发http请求，然后调用一个名为LOAD_APP_SUCCESS的动作，并将有效负载作为响应，然后存储然后将有效负载存储在分别存储AppState道具。

Angular 2 ngrx：带有一个http请求的多个reducer？

2 个答案: