【问题标题】:How to store array in local storage angular?如何将数组存储在本地存储角度?
【发布时间】:2019-08-25 01:30:12
【问题描述】:

我试图将数据存储在一个数组中以便稍后在其他组件中获取它,但这会引发错误:

ERROR TypeError: Cannot read property 'push' of undefined

我使用本地存储。

onSubmit() {
    let email = this.AuthForm.get("email").value;
    let password = this.AuthForm.get("password").value;
    let nomcomplet = "";
    let occupation = "";
    let niveau = 0;
    let newUser = new User(email, password, nomcomplet, occupation, niveau);
    console.log(newUser);
    let val: any = [];
    val = this.storage.get(this.key);
    val.push(newUser.email);
    this.storage.set(this.key, JSON.stringify(val));
}

我希望在本地存储中找到所有存储的值,但实际是错误的,并且之前只存储了最后一个值

截屏

enter image description here

【问题讨论】:

  • console.log(newuser) 返回什么?
  • 当你从 localStorage 获取数组时,使用JSON.parse(localStorage.getItem())。
  • 嗨,谢谢你,但很抱歉,它没有工作

标签: angular local-storage web-storage


【解决方案1】:

您已将数据存储为字符串,因此在检索数据时应将其解析为对象。

设置存储

this.storage.set(this.key, JSON.stringify(val));

从存储中检索

const storageVal = this.storage.get(this.key)
const val = JSON.parse(storageVal)

您可能还想添加一个方法来处理存储对象不存在的情况(返回一个null 值)

const storageVal = this.storage.get(this.key)
const val = storageVal ? JSON.parse(storageVal) : []

【讨论】:

    【解决方案2】:

    好的,让我们试试这个

         let email = this.AuthForm.get("email").value;
         let password = this.AuthForm.get("password").value;
         let nomcomplet = "";
         let occupation = "";
         let niveau = 0;
         let newUser = new User(email, password, nomcomplet, occupation, niveau);
         console.log(newUser);
         let array: any = [];
    
         if (localStorage.getItem(keyToFindOrSave)) {
          //exist data on storage
          //so grab the storage
           array = JSON.parse(localStorage.getItem(this.key)); //we overwrite the same arry with the data from LocalStorage
    
        }
    
          console.log(array); //Watching if have some old data!
          array.push(newUser) //So we push the newUser , if exist something on localStorage the if before actually have the data
          console.log(array); //Watching with new data and old data
          localStorage.set(keyToFindOrSave, JSON.stringify(array)); //and save the data
    

    请记住,keyToFindOrSave 始终需要相同 (y)

    当您需要另一个组件上的数据时,只需使用

    let dataFromStorage : any;
    if (localStorage.getItem(keyToFindOrSave)) { //always ask if exist the localStorage =D
     dataFromStorage = JSON.parse(localStorage.getgetItem(keyToFindOrSave));
    }
    

    Some Screenshot LocalStorage Data

    【讨论】:

    • 我编辑了帖子并在浏览器存储中分享了截屏链接,
    • 这些值是无序的,就像一个垃圾,访问它们会很困难
    • 我想看到的是每个对象都存储有它自己的索引,
    • 1/秒值
    • 让数组:any = []; if (localStorage.getItem('session')) { const data = JSON.parse(localStorage.getItem(this.key)); //我们需要解析来自存储的数据,如字符串 array.push(data); //我们将之前的数据保存在localStorage } console.log(array); //观察是否有一些旧数据! array.push(newUser) //所以我们推送 newUser ,如果 localStorage 上存在某些东西,如果之前确实有数据 console.log(array); localStorage.setItem(this.key, JSON.stringify(array));
    猜你喜欢
    • 1970-01-01
    • 2015-09-05
    • 1970-01-01
    • 2014-01-17
    • 2019-08-16
    • 2015-12-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多