将新数据更新/推送到NgRedux状态

Question

我是新的角和写入服务，我将使用它来添加新的地址(张贴到一个REST )。

saveAddress方法调用返回服务器上新创建的address对象。

我想把它插入到已经存在的地址数组中。我试着做这样的事情：

saveAddress( payload ) {
    this.httpClient.post( this.endpoint, payload).subscribe(
      response => {
        this.ngRedux.select( s => s.addresses ).subscribe( addresses => {
          let data = addresses.data.push( response )

          this.ngRedux.dispatch({ type: ADD_ADDRESS_SUCCESS, payload: data })
        })
      },

      err => {
        this.ngRedux.dispatch({ type: ADD_ADDRESS_ERROR })
      }
    )
  }

我怎样才能做好呢？

Answer 1

除了在Store中，您不能在任何其他地方更改reducer (状态)。还原器接收一个操作(ADD_ADDRESS_SUCCESS)及其有效载荷({address: {...}})，然后使用该信息更新存储：

reducer(state = initialState, action) {
  switch (action.type) {
    case ADD_ADDRESS_SUCCESS:
      return Object.assign({}, state, {
        addresses: state.addresses.push(action.payload.address)
      })
    default:
      return state
  }
} 

注意，我们总是复制状态，而不对其进行变异。要真正理解它，请阅读文档中的@angular/store。

对于API调用，您应该使用Epics：将Epic看作是在处理副作用时将一个操作转换为一个或多个其他操作的管道。在您的示例中，epic响应于ADD_ADDRESS_REQUEST，使用有效负载进行API调用，然后根据API调用的结果将动作转换为ADD_ADDRESS_SUCCESS或ADD_ADDRESS_ERROR。它永远不会更新状态本身，而是将其委托给处理ADD_ADDRESS_SUCCESS和ADD_ADDRESS_ERROR的还原程序。

在相应的@ar角-redux/存储文档中阅读更多关于史诗的内容。