angular-cache not working as expected

I was trying to use angular-cache module into my project but not sure it is working properly or not. Below is the code –

angular.module('TrackerApp').factory('TrackerFactory', function ($resource, CacheFactory) {
    if (!CacheFactory.get('CenterCache')) {
        console.log('cache does not exists');
        CacheFactory.createCache('CenterCache', {
            maxAge: 5 * 60 * 1000,
            deleteOnExpire: 'aggressive'
        });
    }
    var centerCache = CacheFactory.get('CenterCache');
    var CenterClass = $resource(_ServiceBaseURL + 'api/Center/:id',{},{
        query: {
            method: 'GET',
            cache: centerCache,
            isArray:true
        }
    });
    CenterClass.GetMultipleAsObject = function () { return this.query(); };
    return {
        CenterClass: CenterClass
    };
});

On loading of app, it does print message in console that “cache does not exists” and it does create cache in local storage. It created below key in local storage-

“angular-cache.caches.CenterCache.keys” = [http://localhost/Services/Tracker/api/Center]

Another key is created

“angular-cache.caches.CenterCache.data.http:// localhost/Services/Tracker/api/Center” = mystoredvalue

Issues –

1. On page refresh (f5), I do see the console message printed again and in http calls, I can see “Center” information is getting download, it is not picked from cache.
2. On navigating from one page to another, I don’t see the console message getting printed. But I do see the "Center” api getting called. and data being downloaded in network tab. It should have picked from cache.

I feel it is not picking data from cache. Am I missing something?