можем ли мы частично обновить состояние компонента в угловых 6 / ngrx - PullRequest
0 голосов
/ 15 ноября 2018

У меня есть компонент с именем FormComponent , и я настроил редуктор для управления состоянием этого компонента с именем formReducer .

При начальной загрузке я получаю данныев следующем формате

formInfo: {
   form1Data: {form1properties},
   form2Data: {form2Properties},
   form3Data: {form3Properties}
}

Если я хочу выполнить частичное сохранение в form1, как я могу обновить мои state.info.form1Data, не затрагивая (сбрасывая) form2Data & form3Data.

Я хочувыполнить частичное обновление состояния

мой компонент HTML имеет следующий формат:

<div>
  <form> form1Data </form> /*api 1*/
  <form nestedForm> /*api 2*
      <form> form2Data </form>
      <form> form3Data </form>
  </form>
</div>

мой код компонента внутри ngOnInit:

this.actions.pipe(
  ofType(GET_FORM_INFO_SUCCESS),
  mergeMap(v => this.state)
).subscribe((data: any) => {
 if(data && data.formInfo) {
    //inits basic (form1Data) & nested form (form2Data & form3Data)
    this.initForm(data.formInfo);
 }
})

мой редуктор имеет следующий формат:

defaultState = {
  formInfo: {
    form1Data: {
      somePropertiesCollection: defaultValues
    },
    form2Data: {
      somePropertiesCollection: defaultValues
    },
    form3Data: {
      somePropertiesCollection: defaultValues
    }
  }
}

function formreducer(state: defaultState, action: ALL) {
    case GET_FORM_INFO_SUCCESS:
       return {state, ...action.payload}
    case FORM_SECTION_1_SAVE_SUCCESS:
       const form1Data = action.payload;
       const formInfo = {...state.formInfo, form1Data}
       return {...state, formInfo}
    case FORM_SECTION_2_SAVE_SUCCESS:
       const {form2Data, form3Data} = action.payload;
       const formInfo = {...state.formInfo, form2Data, form3Data}
       return {...state, formInfo}
}

Я только начал работать над магазином ngrx и angular 6. Я мог делать небольшие вещи, но столкнулся с проблемой в сложной структуре.

...