如何解决angularJS route 缓存问题

Question

如何解决angularJS route 缓存问题

Answer 1

把下面的代码加上试试
var app = angular.module('phonecat', ['ngRoute']);
app.config(['$routeProvider', '$httpProvider',
function($routeProvider, $httpProvider) {
if (!$httpProvider.defaults.headers.get) {
$httpProvider.defaults.headers.get = {};
}
$httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
$httpProvider.defaults.headers.get['Cache-Control'] = 'no-cache';
$httpProvider.defaults.headers.get['Pragma'] = 'no-cache';

$routeProvider.
when('/phones', {
templateUrl: 'phone-list.html',
controller: PhoneListCtrl
}).
when('/phones/:phoneId', {
templateUrl: 'phone-detail.html',
controller: PhoneDetailCtrl
}).
otherwise({
redirectTo: '/phones'
});
}
]);

 

Answer 2

angularjs路由禁止缓存的方法如下：
myModule.config(['$httpProvider', function($httpProvider) {
//initialize get if not there
if (!$httpProvider.defaults.headers.get) {
$httpProvider.defaults.headers.get = {};
}
//disable IE ajax request caching
$httpProvider.defaults.headers.get['If-Modified-Since'] = '0';
}]);

Answer 3

angular默认的模板加载都会被缓存起来，使用的缓存服务是$tempalteCache，发送模板请求的服务是$templateRequest，可以有两种方案：
1.每次发送$http请求模板完成后，调用$tempalteCache.remove(url)或removeAll清除所有模板缓存；
2.使用$provide.decorator改写原生的$templateRequest，禁掉缓存，$templateRequest的源码，可以看到它默认使用$tempalteCache作为缓存，可以去掉它。

Answer 4

如果用AngularJs在IE下发出GET请求从后台服务取完Json数据再绑定到页面上显示的话，你可能会发现就算数据更新了，IE还是会显示原来的结果。实际上这时候IE的确是缓存了hashtag，没有再次去做Http GET请求最新的数据。
最直接的办法是在后台撸掉OutputCache，但这种做法并不推荐，需要改每一处被Angular调用的地方，代价太大。这种问题应该在前端解决最好。研究了一会儿总结了最有效的解决方法，并不需要改后台代码了。
在你的app config里撸一个$httpProvider进去，比如像我这样，和路由可以配在一起，当然分开配也没问题。