Angularjs cacheFactory : id is already taken

Question

I am using the $cacheFactory to store a language JSON file for the app, and i run a factory method every new route like this:

index.js

$routeProvider
    .when('/',{
      'templateUrl':'views/home/index.html',
      'controller':'Home',
      'resolve': {
        'onEnter': function ($rootScope, langFactory) {

          return langFactory.getLangFile($rootScope.lang.appLang);
        }
      }
    })
    .when('/auth/login',{
      'templateUrl':'views/auth/login.html',
      'controller':'AuthLogin',
      'resolve': {
        'onEnter': function ($rootScope, langFactory) {

          return langFactory.getLangFile($rootScope.lang.appLang);
        }
      }
    })

factories.js

.factory('langFactory', ['$rootScope', '$window', '$http', '$cacheFactory', '$q', function ($rootScope, $window, $http, $cacheFactory, $q) {

    var getLangFile = function (langCode) {

      var deferred = $q.defer()
        , cache = $cacheFactory('langCache');

      if (!!!cache.get('cache' + $rootScope.lang.appLang)) {

        $http.get(langCode + '-langFile-to-be-REMOVED.json').success(function (response) {

          cache.put('cache'  +  $rootScope.lang.appLang, response);

          deferred.resolve();

        }).error(function (err) {

          $window.console.error('Unable to retrieve app language: ' + err);
          deferred.reject(err);
        });
      } else {

         deferred.resolve();
      }
       return deferred.promise;
    };

    return {

      'getLangFile':getLangFile
    };
  }])

On first page load it works , then if i browse, without refreshing, to auth/login i get a console error:

[$cacheFactory:iid] CacheId 'langCache' is already taken!

Seems like (since i call the factory method on every route) it cant use the same id !?

I actually dont know what to do to fix this, any help appriciated, thanks.

Answer 1

This is what worked for me:

cache = $cacheFactory.get('langCache') || $cacheFactory('langCache');