角$ http缓存不工作

Question

我想使用角的http缓存，但结果是未定义的。缓存返回一个对象，但用户缓存未定义。

在main.js控制器

app.controller('exploreController', function($scope, dataService, $cookies, $cacheFactory, $http) { 
// dataService.explorePosts(); 

$scope.explore = function(){ 
    dataService.explorePosts(); 
    var cache = $cacheFactory.get('$http'); 
    console.log(cache); 
    var usersCache = cache.get('http://dstm.herokuapp.com/api/explore'); 
    console.log(usersCache); 

}; 

$scope.explore(); 
}); 

服务在data.js

angular.module('dsnApp') 
.service('dataService', function($http, $cookies, $cacheFactory) { 
    this.explorePosts = function(){ 
    var id = $cookies.get("userId"); 
    $http.get('http://dstm.herokuapp.com/api/explore', {cache: true, 
    params: {userId: id, page: 1}, 
    }) 
    .then(function successCallback(response) { 
    console.log(response); 
    }, function errorCallback(response) { 
    console.log(response); 
    }); 
}; 

Answer 1

@charlietfl是正确的。

$ HTTP是asynchronous.Nothing将被缓存，直到请求 完成，而您试图同步访问缓存。

为了让你想到这个工作：

首先，使this.explorePosts函数返回promise，这$http服务alredy返回。

this.explorePosts = function(){ 
    var id = $cookies.get("userId"); 
    return $http.get('http://dstm.herokuapp.com/api/explore', {cache: true, 
     params: {userId: id, page: 1}, 
    }) 
    .then(function successCallback(response) { 
     console.log(response); 
    }, function errorCallback(response) { 
     console.log(response); 
    }); 
    }; 

然后使用在承诺的then回调缓存。

$scope.explore = function() { 
    dataService.explorePosts().then(function() { 
     var cache = $cacheFactory.get('$http'); 
     console.log(cache); 
     var usersCache = cache.get('http://dstm.herokuapp.com/api/explore'); 
     console.log(usersCache); 
    }); 
}; 

（ 'exploreController'，[ '$范围'， '$ cacheFactory'，函数（$范围，DataService的，$饼干，$ cacheFactory，$ HTTP）{