javascript - 从 localStorage Angular 的数组中删除项目

标签 javascript angular

我已经尝试这样做有一段时间了,下面的代码是我目前拥有的代码,当我只有一个数组时它可以工作,但是当我运行删除函数时整个应用程序都会卡住并且我无法退出,有人可以告诉我我做错了什么吗?我为每个输入的数组自动添加 id,但我不知道为什么它会卡住

/*Favourites Service */
public deleteLocalStorage(id, i ): void {
  const currentArray = this.storage.get(this.STORAGE_KEY);
  for (i = 0; i < currentArray.length;) {
    if (currentArray[i].id === id) { currentArray.splice(i, 1); }
  }
  // insert updated array to local storage
  this.storage.set(this.STORAGE_KEY, currentArray);
}
/*Home page Delete function*/
deleteFav(id, i) {
  this.Local.deleteLocalStorage(id, i);
  console.log(id, i);
}
<div class="panel col-5" (click)="deleteFav(stop.id, i)">
 <img class="panel-remove" src="assets/img/icon_remove.png" />
</div>

最佳答案

不是将数组存储在本地存储中,而是在存储时对数组进行字符串化,并在获取时仅解析它。这样,您就不会在本地存储中存储复杂的数组,而是存储字符串。


public deleteLocalStorage(id, i ): void {
  const currentArray = JSON.parse(this.storage.get(this.STORAGE_KEY));
  for (i = 0; i < currentArray.length; ++i) {
    if (currentArray[i].id === id) { currentArray.splice(i, 1); }
  }
  // insert updated array to local storage
  this.storage.set(this.STORAGE_KEY, JSON.stringify(currentArray));
}


localStorage.set(key, JSON.stringify(arr));

let x = JSON.parse(localStorage.get(key));

关于javascript - 从 localStorage Angular 的数组中删除项目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57481551/

相关文章:

css - 如何自定义 Angular Material Input 中的样式?

angular - Angular2 中的 Firebase 云消息传递

javascript - TestCafe/多存储库项目

javascript - javascript onclick 事件的范围为 'this'

javascript - 身份验证后应在 Flux 应用程序中的何处进行存储重新获取操作?

javascript - 使用钢笔工具在 Canvas 上流畅地绘制一条线,而无需重新绘制所有其他线

javascript - 在多个 Canvas 上默认禁用 imageSmoothingEnabled

javascript - 有没有办法将 "subscribe"更改为 Angular 中的数组变量?

javascript - 获取匿名对象类型的字符串名称?

css - 为什么 angular 2 组件会影响它托管的实际 html 的样式?