angularJS/ionic cannot read property 'then' of undefined - angularjs

Question

I'm adding Caching to my App everything works fine from caching data, getting it expired and re-cache. When I implemented the functionality of putting the same expired data in the cache again if there is no connection I get this error: Cannot read property 'then' of undefined
Here is the code of my controller:
.controller('ItemsCtrl', function($scope, $http, DSCacheFactory) {
//handle the catche to hold the items lits.
self.itemsCache = DSCacheFactory.get("itemsCache");
/*
*Function to re-refresh the cach after expire
*re-use the old cache if no internet connection available
*/
self.itemsCache.setOptions({
onExpire: function(key, value){
getItems()
.then(function(){
console.log("Items Cache was automatically refreshed", new Date());
}, function(){
console.log("Errorgetting data put expired item back in the cache", new Date());
});
}
});
function getItems(){
var cacheKey = "items",
itemsData = self.itemsCache.get(cacheKey);
if(itemsData){
// if data in the cache dont make HTTP calls.
console.log("Found Data in cache", itemsData);
//recive Data from the cache
$scope.items = itemsData;
}
else{//if no data in the catch make HTTP calls.
//HTTP request to get the items data.
$http.get('services/data.json')
.success(function(data){
console.log("Recived data via HTTP");
//caching the data recived from the http calls.
self.itemsCache.put(cacheKey, data);
$scope.items = data;
});
}//end of the else statment
}
getItems();
})

Answer 1

This didn't work I just didn't want to ruin the question.
.controller('ItemsCtrl', function($scope, $http, $q, DSCacheFactory) {
//handle the cache to hold the items lits.
self.itemsCache = DSCacheFactory.get("itemsCache");
/*
*Function to re-refresh the cache after expire
*re-use the old cache if no internet connection available
*/
self.itemsCache.setOptions({
onExpire: function(key, value){
getItems()
.then(function(){
console.log("Items Cache was automatically refreshed", new Date());
}, function(){
console.log("Errorgetting data put expired item back in the cache", new Date());
});
}
});
function getItems(){
var deferred = $q.defer(),
cacheKey = "items",
itemsData = self.itemsCache.get(cacheKey);
if(itemsData){
// if data in the cache dont make HTTP calls.
console.log("Found Data in cache", itemsData);
//receive Data from the cache
$scope.items = itemsData;
deferred.resolve(itemsData);
}
else{//if no data in the catch make HTTP calls.
//HTTP request to get the items data.
$http.get('services/data.json')
.success(function(data){
console.log("Received data via HTTP");
//caching the data received from the http calls.
self.itemsCache.put(cacheKey, data);
$scope.items = data;
deferred.resolve(data);
});
}//end of the else statement
}
getItems();
})

Answer 2

The function getItems isn't returning anything - it looks like you meant to return a promise so it should be something like below.
When you find the item in the cache you can use $q.when to create a promise that's already resolved when the parameter isn't a promise.
When you don't find it, you can return the chained promise from $http.get.
.controller('ItemsCtrl', function($scope, $http, DSCacheFactory, $q) {
//handle the cache to hold the items list.
self.itemsCache = DSCacheFactory.get("itemsCache");
/*
*Function to re-refresh the cache after expire
*re-use the old cache if no internet connection available
*/
self.itemsCache.setOptions({
onExpire: function(key, value){
getItems()
.then(function(itemsData){
console.log("Items Cache was automatically refreshed", new Date());
}, function(){
console.log("Error getting data put expired item back in the cache", new Date());
});
}
});
function getItems(){
var cacheKey = "items",
itemsData = self.itemsCache.get(cacheKey);
if(itemsData){
// if data in the cache dont make HTTP calls.
console.log("Found Data in cache", itemsData);
//receive Data from the cache
$scope.items = itemsData;
return $q.when(itemsData);
}
else{//if no data in the catch make HTTP calls.
//HTTP request to get the items data.
return $http.get('services/data.json')
.success(function(data){
console.log("Received data via HTTP");
//caching the data received from the http calls.
self.itemsCache.put(cacheKey, data);
$scope.items = data;
return data;
});
}//end of the else statement
}
getItems();
})