Localstorage not working with array of objects

Question

I am trying to understand why when I uncomment the lines of code below then it no longer shows my array of employees I have displaying on my index page also after I submit a form to add an employee it doesn't display it either, so yes if I keep it the way it is then it works just fine but I need it to work with the localstorage.

angular.module("MyApp").service("dataService", function() {

    var employeesArray = [{employeeName:'Me', employeeStreet:'12345 Local Street', employeeCity:'MyCity', employeeState:'MyState', employeeZipCode:'12345'}];

    this.getEmployees = function() {
        /*
        var str = localStorage.getItem("Employees");
        employeesArray = JSON.parse(str) || employeesArray;
        */
        return employeesArray;
    }

    this.addEmployee = function(employee) {
        employeesArray.push(employee);
        /*
        var str = JSON.stringify(employeesArray);
        localStorage.setItem("Employees", str);
        */
    }

    this.removeEmployee = function(employee) {
        employeesArray.splice(employeesArray.indexOf(employee), 1);
        /*
        var str = JSON.stringify(employeesArray);
        localStorage.setItem("Employees", str);
        */
    }
});

I am guessing that the call to the service method getEmployees() is what returns the data to be shown. If you add debugging statements in this method to show what is being returned ... what is being returned? — Kolban
– Kolban, Commented Nov 9, 2014 at 21:14

Kichrum · Accepted Answer · 2014-11-10 08:47:21Z

0

The solution is getting the list of employees from the localStorage every time before working with it. So try to add

var employeesArray = this.getEmployees();

as the first line to addEmployee and removeEmployee methods. Don't forget to run localStorage.clear() before testing new changes.

Check out please this JS fiddle: http://jsbin.com/qawabifefa/2/edit?js,output

edited Nov 10, 2014 at 8:47

answered Nov 9, 2014 at 22:09

Kichrum

6077 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user3732216 Over a year ago

Is there anything else it could be? Its not working on my system.

Kichrum Over a year ago

You can try to reproduce your problem on jsbin. Don't forget to call localStorage.clear() in the console. Pay attention on how I defined defaultEmployeesList (as string and then parsed it - so AngularJS won't throw ngRepeat:dupes error). And try to look at console (F12) and copy-paste errors here.

Collectives™ on Stack Overflow

Localstorage not working with array of objects

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related