AngularJS data lost on refreshing the page

Question

Each time I refresh my page, the data in AngularJS variables is lost. How to retain them without using cookies? Can anyone help me with an approach? Its different from the previous question because I am interested in a solution that does not use cookies.

use localstorage? As variables are stored in memory, you have to save them in persistent storage. — Rebornix, Feb 23 '16 at 05:52
I shall try picking up things from the post. Thanks. But its not really duplicate — Nickal, Feb 23 '16 at 06:05

Rahul · Accepted Answer · 2016-02-23T06:13:33.243

3

For amounts of data less than 4k you can use $cookieStore. If it is more than that you'll need to look into HTML5 localStorage

For more details please go through this post you will find different options of storage with comparison http://www.html5rocks.com/en/tutorials/offline/storage/

edited Feb 23 '16 at 06:13

answered Feb 23 '16 at 06:02

Rahul

367
2
6
27

is there not another way than using cookies? I wanna avoid it – Nickal Feb 23 '16 at 06:03
You can use localStorage – Rahul Feb 23 '16 at 06:05
Go through this links https://github.com/grevory/angular-local-storage http://ngmodules.org/modules/ngStorage – Rahul Feb 23 '16 at 06:06
Thanks for the input. M trying. – Nickal Feb 23 '16 at 06:06

score 2 · Answer 2 · answered Feb 23 '16 at 06:12

2

I think that you have only 2 options here:

Use localStorage. There're lots of handy localStorage angularJS modules to use.
If you don't want to store data on the client side, you could request your API for the data you need to store each time your angular app is getting loaded. This data seems to be static, as you are storing it on client side and reuse then, so you could configure API endpoint to throw this data really fast.

answered Feb 23 '16 at 06:12

xSaber

384
1
11

I used localStorage and its working. Thanks – Nickal Feb 23 '16 at 06:14

score 1 · Answer 3 · answered Feb 23 '16 at 06:31

1

use localStorage.setItem("key",value); to set the value.

use localStorage.getItem("key");to get the value.

use localStorage.clear();to clear the value which is set

answered Feb 23 '16 at 06:31

Anirudh

558
1
6
22

AngularJS data lost on refreshing the page

3 Answers3