Angular js - cache a rootScope param and it's value

Question

Hey how do i cache for x time this simple object that i set via $http ( $rootScope.config.app_genres)?

 $http.get($rootScope.config.app_ws+'get/genres',{},{cache:true}).success(function(response) {
    $rootScope.config.app_genres =  response;
  });

i just would like to cache it to not repeat everytime the http request

Cystolith

Answer 1

As stated in $http documentation, you can provide your own cache object instance through the cache configuration option.

Here's a $cacheFactory where I override the put method so that the cache gets cleared after TIMEOUT. Note that this only works for one URL. I'll leave making this timer cache object generic as an exercise for you.

function Ctrl($scope, $http, $cacheFactory, $timeout) {
  var timedCache = $cacheFactory('myCache'),
      TIMEOUT = 5000,
      cacheTimer = null;

  timedCache._put = timedCache.put;
  timedCache.put = function (key, val) {
    console.log('caching', key);

    $timeout.cancel(cacheTimer);
    cacheTimer = $timeout(function () {
      console.log('clearing cache for', key);
      timedCache.remove(key);
    }, TIMEOUT, false);

    timedCache._put(key, val);
  };

  $scope.request = function () {
    $http.get('/echo/json', {
      cache: timedCache
    })
    .success(function (data) {
      console.log('received', data);
    });
  };
}

Here's the fiddle with this working: http://jsfiddle.net/sirhc/jvLPX/

Fairly

Answer 2

H i , ( hoping Angular has something built in, that others may add but )

I guess we could assign it to a new variable

$rootScope.dataCache = $rootScope.data;

$rootScope.cacheTimer = 50000; 

Your websites application always reading from $rootScope.dataCache and a routine to check and/or auto update when CacheTimer had elapsed, to recall the server side and re assign.

?

Doom

so dataCache and cacheTimer are natives? :P – Cystolith

nope, they sound like they could be, no, just regular variable names of your choosing. – Doom

thanks man , can you please provide a working example also for the community? :) – Cystolith

given enough time today, maybe. Let me know if this didn't help I will delete it if so and leaves the question "unanswered", and or post up how far you got using this principle. – Doom

Answer 3

I use this code to cache templates

$http.get(/*URL*/, {cache: $templateCache})
    .success(function () { ... })
    .error(function () { ... });

but maybe this one will be more of what you want to do https://coderwall.com/p/40axlq

Foolscap

Answer 4

You could use cache busting for your requirement. Lets say if you want to cache only for x seconds. The you add a cache busting query parameter with value

Math.floor(new Date().getTime() / (x * 1000))

The request would look like

$http.get(url,{cacheBuster: Math.floor(new Date().getTime() / (x * 1000))},{cache:true})

Kilohertz