如何将数据从一个文件传输到另一个文件？

Question

我有两个文件，例如，

employee-rates-controller.ts：

private load() {

return this.entityService
      .load(this.$scope.projectRevisionUid)
      .then(resp => {
        localStorage.removeItem('employeerates');
        this.$scope.employeeRates = resp.employeeRates;
        return this.refreshCostRate(...resp.employeeRates)
          .then(() =>
            localStorage.setItem(
              'employeerates',
              JSON.stringify(this.$scope.employeeRates)
            )
          )
      .then(() => this.refreshBillRate(...resp.employeeRates))
      .then(() => resp.employeeRates.forEach(erm => this.calculate(erm)))
      .then(() => DatepickerUtil.reinitializeDatepickers(this.$scope));
      })

}

在另一个文件中，

getEmployeeRates.ts：

  const employeerates = JSON.parse(
    localStorage.getItem('employeerates')
  );

  if (employeerates && employeerates.length != null) {
    employeerates.forEach((element: any) => {
      if (
        this.employee.getUid() === element.user.personUid &&
        element.internalRate
      ) {
        this.cost_rate_uom = element.internalRate * this.uom_factor;
        this.cost_rate_per_hour =
          this.cost_rate_uom / this.uom_factor;
        this.cost_rate.setValue(this.ap4_cost_rate_per_hour);
      }
    });
  }

在这里你可以看到，

在第一个 ts 文件中，

localStorage.setItem('employeerates',JSON.stringify(this.$scope.employeeRates))

并在第二个 ts 文件中接收数据，

const employeerates = JSON.parse(localStorage.getItem('employeerates'));

如果我添加的员工很少，我找不到任何问题，但是当我继续添加员工时，这意味着将它们存储到 localstorage，当数据量很大时，我会在某个时间点收到错误，并且它阻塞了整个过程。

错误是，

QuotaExceededError：无法在“存储”上执行“setItem”：设置 'employeerates' 的值超过了配额。

所以我想在不使用本地存储的情况下将任何大数据从一个文件传输到另一个文件时获得一些好的解决方案..

由于该应用程序是在 Angularjs 和 Typescript 组合中制作的，我无法找到正确的解决方案，因为我是这个场景的新手。

编辑：

除了第一个 TS 文件，我还可以获取此文件中的值。

employeeratemodel.ts：

export class EmployeeRateModel {
public uid: string;
.
.
.
public internalRate: number; // Getting the value here
}

如何在第二个 ts getEmployeeRates.ts: 文件中获取这个值..

我的尝试：

import { EmployeeRateModel } from '../component/employee-rates/model/employee-rate.model';

constructor() {
    const data = new EmployeeRateModel();
    console.log(data) // {}  // Gives empty object.. I need to fetch the internalRate from it..
  }

在这里，如果我得到数据，那么我很容易得到计算所需的internalRate，但由于一切都返回为空，这对我来说也失败了..

请帮助我以适当的方式修复它，卡住了很长时间..

Answer 1

使用IndexedDB，它是一个大规模的NoSQL存储系统。它可以让您在用户的浏览器中存储几乎任何内容，并且它有一个基于客户端计算机的huge limit，约占总存储空间的 20%。

NPM 包Angular IndexedDB

Answer 2

Chrome 的本地存储默认大小为 10 Mb (https://en.wikipedia.org/wiki/Web_storage)，因此清除 chrome 的本地存储可能会对您有所帮助，如果您的数据大于限制，您可能需要寻找替代方案，例如存储在 blob 存储上并访问来自 blob 本身的内容。

作为参考，如果你想使用下面的代码，你可以处理错误。

try {
     var counter = 1;
     var stringData = "AddLocalStorageTillItIsFull";
     for (var i = 0; i <= counter; counter + 1) {
         stringData += stringData;
         localStorage.setItem("localStorageData", stringData);
         console.log(stringData);
         console.log(counter);
     }

 }
 catch (e) {
     // When local storage is full, it goes hits this carch block
     console.log("Local Storage is full, Please clear local storage data to add more");
 }