Question

我的表单具有如下所示的验证

<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],
    })
  }

我有本地存储服务，所以我尝试了如下操作

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

这是我的问题，当用户重新加载页面或返回/前进时，数据应该在输入字段中。但是上面的代码并没有发生

我尝试过的链接在stackoverflow中得到了回答 link，但答案都无济于事。所以任何人都可以给我一个更好的答案

Answer 1

创建表单时，您无需设置表单的值。

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

如果您的存储服务返回一个对象，它将起作用。

Answer 2

每次重新导航组件和表单时，都需要检查本地存储中是否有数据（如果有），那么一旦创建表单，就需要将其分配给表单

如果用户刷新/重新加载，则保留表单数据

2 个答案: