将表单数据字段存储到本地存储不起作用

Question

我正在尝试附加 formGroup 字段以存储在本地存储中，以便我可以在另一个页面上获取它。我的代码是

.ts 文件是

   var u8Image  = b64ToUint8Array(b64Image);
const file = new File([u8Image], rString + '.jpg', { type: "image/jpeg", lastModified: Date.now() });
const clothsize = this.sizeForm.value.clothsize;
const quantity = this.sizeForm.value.quantity;
 var formData = new FormData();
 formData.append("image", file);
 formData.append('clothsize', clothsize);
 formData.append('quantity', quantity);
 formData.append('design', this.fileDesign);
 this.service.addToCart(formData)
 console.log('success')

service.ts 是

  getCart(){
const formData = localStorage.getItem('formData');
return formData? JSON.parse(formData) : [];


 }

  addToCart(data) {
    const formData: Data[] = this.getCart();
    if (!formData) {
      this.setTodosIntoStore([data]);
    } else {
      formData.push(data);
      this.setTodosIntoStore(formData);
    }

}

setTodosIntoStore(formData: Data[]) {
  localStorage.setItem('formData', JSON.stringify(formData));
}

我在本地存储中获得了空白文件。有没有办法将响应式表单组数据保存在本地存储中？

Answer 1

另一种方法是先将反应式表单数据保存到本地存储中，然后在您必须发布时通过从本地存储中获取它来创建 formData。

localStorage.setItem('data', JSON.stringify(this.sizeForm.value));

Answer 2

而不是将 formData 转换为 JSON ：

localStorage.setItem('formData', JSON.stringify(formData));

尝试从 formData 创建一个对象，然后将其转换为 Json，如下所示：

localStorage.setItem('formData', JSON.stringify(Object.fromEntries(formData.entries())));

你说fromEntries不支持，那就试试吧：

let object = {};
formData.forEach(function(value, key){
    object[key] = value;
});
let json = JSON.stringify(object);

localStorage.setItem('formData', json);