У меня есть компонент с именем 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. Я мог делать небольшие вещи, но столкнулся с проблемой в сложной структуре.