[SOLVED] How to use angular cache to store on page refresh?

How to use angular cache to store on page refresh?

I'm attempting to use angular-cache v4.2: angular-cache I am unable to get it storing between page refreshes.

I tried to create a codepen, but didn't get very far as I have been unable to inject the module on there. codepen.

angular.module('myApp', ['angular-cache'])
  .config(function (CacheFactoryProvider) {
    angular.extend(CacheFactoryProvider.defaults, { maxAge: 15 * 60 * 1000 });
  })

However, even when I get it to create caches, it loses the cache when the page is refreshed - I have tried the three different storage types and haven't been able to get any working on chrome version 39.

Solution

Answer with the help of Shehryar's comment. See:

codepen

 // To add to local storage
  localStorageService.set('localStorageKey','Now this!');
  // Read that value back
  $scope.value = localStorageService.get('localStorageKey');

Using the angular local storage module, this example will store the cache create after a page refresh. It is also possible to add in

localStorageService.clearAll();

and then refresh the page to remove the initial value.