I have two files which are named as,
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));
})
}
And in the other file,
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);
}
});
}
In one of the ts files, we have,
localStorage.setItem('employeerates',JSON.stringify(this.$scope.employeeRates))
And in the second ts file where we receive the data,
const employeerates = JSON.parse(localStorage.getItem('employeerates'));
While adding a few employees does not cause issues, adding a large number of employees and storing them into localstorage results in an error when the data size becomes too large, ultimately blocking the entire process.
The specific error encountered is as follows:
QuotaExceededError: Failed to execute 'setItem' on 'Storage': Setting the value of 'employeerates' exceeded the quota.
Hence, I am looking for a solution to transfer large data from one file to another without relying on local storage.
Since the application is built using the combination of Angularjs and Typescript, finding the right solution has been challenging due to my limited experience in this scenario.
Edit:
In addition to the first TS file, I can also fetch the value in this file.
employeeratemodel.ts:
export class EmployeeRateModel {
public uid: string;
.
.
.
public internalRate: number; // Accessing the value here
}
How can I retrieve this value inside the second ts file getEmployeeRates.ts:?..
My attempt so far:
import { EmployeeRateModel } from '../component/employee-rates/model/employee-rate.model';
constructor() {
const data = new EmployeeRateModel();
console.log(data) // {} // The result is an empty object.. I need to extract the internalRate from it..
}
If I can successfully retrieve the data, I will be able to access the internalRate required for calculations. However, since everything returns empty currently, this approach has not worked for me.
Please assist me in resolving this issue in the most appropriate manner, as I have been stuck on this problem for a while now.