Javascript 刷新后将数据保留在页面中

我的angular项目有两个页面，一个是主页，另一个是弹出页面。我在弹出页面中输入数据以输入标签，然后当我单击“添加”按钮时，数据被添加到主页面。它工作得很好。我在主页面中保存了一个数组。但是如果我刷新页面（主页面），数据似乎不再存在。你知道吗

我做了一些研究，学习了本地存储和cookies。但我可以将数据从一个页面发送到另一个页面。我想做的是将数据保存在页面中。我如何处理它

---

据我所知，我们使用localstorage将数据发送到另一个页面。对吗？

这可以通过localstorage完成

例如：

localStorage.removeItem('Array');
localStorage.setItem('Array', JSON.stringify(this.array));

以上是您如何保存它以将其取回您可以在ngOnInit中执行此操作：

this.array = JSON.parse(localStorage.getItem('Array'));
localStorage.removeItem('Array'); // to clear it again.

编辑

进口：

从'@angular/core'导入{OnInit}

在组件（类）上实现它：

导出类YourClass实现OnInit

建造师之后：

ngOnInit() { // your code here }

正如您所说的，
window.localStorage
是一种方法。您将数据存储在
localStorage
中，即使在关闭会话后，数据也将被保留。在angular中，您可以创建一个服务来简化从存储器访问特定数据的过程

要在进入页面时从
localStorage
重新加载数据，可以使用
ngOnInit
lifecycle钩子从存储中加载数据并填充视图。
我将创建一个简单的服务，帮助您管理localStorage数据。简单地说：

import { Injectable } from '@angular/core';

@Injectable()
export class SharingService {
  private storageName: string = "Settings";

  constructor() { }

  setSettings(data: any) {
    localStorage.setItem(this.storageName, JSON.stringify(data));
  }

  getUserSettings() {
    let data = localStorage.getItem(this.storageName);
    return JSON.parse(data);
  }

  clearUserSettings() {
    localStorage.removeItem(this.storageName);
  }

  cleanAll() {
    localStorage.clear()
  }

}

我的数据在我的主页的数组中。现在，我将把ngOnInit方法添加到我的主页，我将使用localStorage获取数据。我不会添加任何代码弹出页面。我是对的？我可以在主页的任何地方设置进程。@Sneidder10是的，你可以用ngOnInit在后台加载数据。非常感谢。我正在使用rihght nowYes搜索Ngonintıt。数据将在任何其他页面上可用，Localstorage将保存在浏览器中。如果您在浏览器的控制台中编写
JSON.parse（localStorage.getItem（'Array'））
，您将获得到的输出。非常感谢。我将向ngOnInıt方法添加获取进程如何使用Ngonit方法？我应该将其作为模块添加到项目中吗？当我将它定义为函数时，它并没有开始：（我5天前开始学习AngularJS。我没有课。我的设计是这样的
angular.module（'app'）。controller（'MyController'，MyController'）；function MyController（$scope，…）{//controller definition}
这看起来像AngularJS（v1.0+）。当前的新angular（v4.4）。非常感谢。我将向我的控制器注入此服务。这在@m33n非常有用，谢谢。但是，如果本地存储被删除（手动），该怎么办使用浏览器的devtools？当用户重新加载页面时，本地存储将为空。在这种情况下，我们必须再次从原始源获取数据？或者有什么解决方案？谢谢