localStorage will not updated (after reload the current value is not there)

[Lioxen]

I have an application where I use ngStorage to save some time values which will decreased every second, but with ngStorage the current time value will not shown after reload (its only decreased by one). To demonstrate this I have created an plunker: http://plnkr.co/edit/d48NAdAoS03qzAi3N9ND?p=preview Just input a integer and submit. After a while reload the page. The ngStorage value is than just decreased by one, but the localStorage value has the correct time. Why is that?

Now some explanation why my code is a little more complex to demonstrate this behaviour: In my real app the timevalue is a json object with a few timevalues in it and in the timewaitingService the setWait function calcs the lowest one to show this to the audience. Also in the tick function every timevalue will be decreased by one every second. So I like to show this demonstration code as near as possible to my code in the real app. May its my fault, because it is my first app using angular js. May somebody can explain why the timevalue will not be updated every second, but if I use the plain localstorage function it will.

[akizor]

Same here

[milushov]

I have similar issue: $localStorage contain my value, but localStorage does not

[emiidee]

Same: localStorage saves value a, at some point I update it to value b (this works), then when I refresh it goes back to value a

[SlashingEdge]

I'm having the same problem as emiidee, it does update to new value but it keeps giving the old value when I refresh, why is that?

[egilkh]

@SlashingEdge could you try using master ngStorage.js and provide a snippets where this happen for me to test? :)

[egilkh]

As the plnkr doesn't seem to work, anyone that can confirm this still is a issue?

[ghost]

Same here, updating $localStorage.token every 30 mins. The value remains the same.

[egilkh]

I noticed this and will be looking into it. I didn't seem to have this problem when I used an object (which is how I usually use $localStorage). Ex:

$localStorage.awesome = { key: 'value' };

In which it seemed more consistent. Will look into it.

[bdkent]

I notice the behavior described above where updates stopped working if I have multiple $localStorage.$default({...}); calls with different defaults in different angular components.

For example, if ServiceA has var $storageA = $localStorage.$default({ a: "foor"}); and ServiceB has var $storageB = $localStorage.$default({ b: "bar"});.

I got around this by making my own service wrapper with a var $storage = $localStorage.$default({ a: "foo", b: "bar"});. Then the wrapper service had a method to getA() and getB().

Note sure if this is a correct usage, but it got around the issue for me.

[egilkh]

Thanks bdkent for the reports.

There should be no need to make extra services. And I'll continue working on it. But sadly my time has been limited these last weeks. But I'm still here and will have more time soon :)

[RolandHeath]

I found that for me this was an issue with $localstorage.$default.

My workaround was to replace x = $localstorage.$default({a: "foo"}) with x.a = $localstorage.a || "foo";

This seems to restore the expected behaviour, having replaced $default everywhere in my code.

[egilkh]

Thanks. Seems the whole of $default is a little screwed up.

[omarmeky]

+1

Current workaround: $localStorage.a = $localStorage.a || 'foo';

[emanuel-virca]

I've faced a similar issue and it happened because I was setting item using localStorage.setItem(key value) and tried to read data using $localStorage.key which, of course is not ok. I used localStorage.setItem because of the need to immediately catch QuotaExceededError. The fix was to read data using localStorage.getItem or call $localStorage.$sync() to sync the ngStorage with native localStorage .

[pruthvim96]

i have same issue regarding this local storage first i have x value when i go to previous page and get y value i am getting y value.but, i need to be displayed with x and y value

[avimatrix]

Same: localStorage saves value a, at some point I update it to value b (this works), then when I refresh it goes back to value a

you can call a method in respective service regarding to localStorage like getRole(),getToken()..it return localStorage.getItem('key') so in your template(.html) ,you can call directly like authService.getToken() it returns updated value only. Before that you can provide dependency injection in your component. It works...