я использую angular реактивную форму. Я хочу сохранить данные формы после выхода из компонента, используя плагин формы ngxs.
моя форма:
travelerForm: FormGroup;
this.travelerForm = this.formBuilder.group({
toppings: ['', Validators.required],
accept: [true, Validators.requiredTrue],
});
мой код состояния:
import { Action, State, Store, Selector } from '@ngxs/store';
import { SubmitTravelerForm } from '../actions/travelers.action';
@State<any>({
name: 'traveler',
defaults: {
travelerForm: {
model: undefined,
dirty: true,
status: '',
errors: {}
}
}
})
export class TravelerState {
@Action(SubmitTravelerForm)
submitForm({getState}){
console.warn(getState().travelerForm);
}
constructor(private store: Store) {}
@Selector() static travelerForm(state: any) {
return state.travelerForm;
}
}
мой код действия:
export class SubmitTravelerForm {
static readonly type = '[Traveler] Submit Form';
}
мой html код:
<form [formGroup]="travelerForm" novalidate ngxsForm="traveler.travelerForm" ngxsFormClearOnDestroy="false" (ngSubmit)="onSaveAndContinue()">
<input type="text" formControlName="toppings">
<br>
<input type="checkbox" formControlName="accept" id="accept"><label for="accept">I accept your terms</label>
<button type="submit" >Submit</button>
</form>
и мой метод onSaveAndContinue ():
this.store.dispatch(new SubmitTravelerForm());
this.router.navigate(['../payment/confirm'], {
queryParams: {
source: this.source,
}
});
как я могу получить значение формы отправки и привязать к моей форме, чтобы сохранить значение данных формы после выхода из компонента и вернуться