как сохранить angular реактивную форму - PullRequest
0 голосов
/ 06 мая 2020

я использую 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,

      }
    });

как я могу получить значение формы отправки и привязать к моей форме, чтобы сохранить значение данных формы после выхода из компонента и вернуться

Ответы [ 2 ]

0 голосов
/ 06 сентября 2020

Удалите ngxsFormClearOnDestroy = "false", чтобы данные были там после возврата stackblitz .

0 голосов
/ 17 мая 2020

при том, что http://ngxs.io говорят: Помимо этих проблем, существуют рабочие процессы, в которых вы хотите заполнить форму и уйти, а затем вернуться и восстановить свой текущий статус, но как? у кого-то есть решение?

...