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

angularjs, caching, javascript, rootscope

Solution

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/

Problem

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

Original source