Keep Form data if user Refresh/reload

Issue

I have Form with validation like below like below

<form  [formGroup]="LoginForm">
  First name:<br>
  <input type="text" formControlName="firstname" >
  <br>
  Last name:<br>
  <input type="text" formControlName="lastname">
  <button  type="submit"  [disabled]="!this.LoginForm.valid"></button>
</form> 

component.ts

LoginForm: FormGroup;

onloginUser() {
    this.LoginForm = this.form.group({
      firstname: ['', Validators.required],
      lastname: ['', Validators.required],
    })
  }

I have a local storage service so I tried like below,

this.storage.set("user_data",this.LoginForm.value);
this.storage.get("user_data");

Here My question when I user reload the page or if I went back/forward, the data should there in the input fields. but it is not happening with above code

what I tried link which is answered in stackoverflow link but none of the answer is helped me. So could any one give better answer which is helpful to me

Solution

You're not setting the value of your form when you create it.

 this.LoginForm.patchValue(this.storage.get("user_data"));

Will work if your storage service returns an object.

Answered By - user4676340