-1

I have put many reative form on mat-steps in angular 12 but it comes in initial step on refresh page,how can i save the state whereas i refresh the page,any idea?

enter image description here

 <mat-stepper labelPosition="bottom" linear  #stepper>
    <mat-step [stepControl]="selForm"></mat-step>
    <mat-step [stepControl]="indentityGrp" [editable]="isEditable"></mat-step>
    <mat-step [stepControl]="address" [editable]="isEditable2" class="border"></mat-step>
    <mat-step [stepControl]="member" [editable]="isEditable3"></mat-step>
</mat-stepper>
manoj sahni
  • 35
  • 1
  • 7

1 Answers1

2

Option 1: send it to the server and store the temporary form data there and fetch it on every app initialize.

Option 2: save on localStorage something like :

this.form.valueChanges.subscribe(data => localStorage.setItem('form', data)) 

and in your component

ngOnInit() {
   this.form.fetchData(localStorage.getItem('form'))
}
Eli Porush
  • 1,339
  • 1
  • 7
  • 18
  • Ok mr eli but i m not loosing my data on refresh ,it comes on step 1 after refresh ,suppose that i filled the address form successfully when i refresh the page it will come on select form step – manoj sahni Sep 18 '22 at 12:13