Angularjs - 如何清除$ routeProvider的templateUrl缓存

kuc*_*ram 8 angularjs

我在我的应用程序中有一个非常基本的用例,我使用AngularJS(1.0.8)作为前端,Grails作为后端.在应用程序布局中,我有一个语言切换器,允许用户更改语言.切换语言时,会执行新的http请求来检索页面.Grails可以正确翻译所有与语言相关的内容(即标签).这仅适用于Chrome,FF等,但不适用于IE.IE只为主要请求呈现的布局呈现正确的语言.

我找到了问题.我已经定义了$routeProvider加载主要应用内容的位置.它默认是缓存的,因此IE不加载templateUrl,$routeProvider因为它从缓存中加载它们:

myApp.config(function ($routeProvider) {
        $routeProvider.
            when('/', {controller: 'MyCtrl', templateUrl: '/eshop/myConfig'})
});
Run Code Online (Sandbox Code Playgroud)

我没有得到的是为什么它适用于所有其他浏览器.

我发现了一些帖子如何清除缓存,但它们对我不起作用.我有什么解决方案吗?如果没有,我觉得$routeProvider我的用例完全没用.我找到的帖子:

Kin*_*noP 10

下面应该这样做.您可以使用$ templateCache操作angularjs的模板缓存,因此每次访问控制器时,$ routeProvider都会将模板加载为新模板.

myApp.config(function ($routeProvider) {
        $routeProvider.
            when('/', {controller: 'MyCtrl', templateUrl: '/eshop/myConfig'})
})

.controller('MyCtrl', function ($scope, $templateCache) {
    $templateCache.remove('/eshop/myConfig');
    // or
    $templateCache.removeAll();
});
Run Code Online (Sandbox Code Playgroud)


Pen*_*eng 6

我遇到了与$ routeProvider相同的问题.是的,$ templateCache在这种情况下无济于事.我没有继续找到真正的"缓存"源,而是在templateUrl之后添加了stamp参数.在我的代码中:

$routeProvider.
        when('/', {templateUrl: '../views/home.html?v='+window.buildNumber, controller: 'HomeCtrll'}).
        when('/report', {templateUrl: '../views/form.html?v='+window.buildNumber, controller: 'FormCtrll'}).
        otherwise({redirectTo: '/'});
Run Code Online (Sandbox Code Playgroud)

可悲的是,我使用全局变量"buildNumber"来拯救我的生命.因为我还使用RequireJS作为我的AngularJS项目,所以这个"buildNumber"也将通过使用代码添加到每个依赖JS文件中:

require.config({
    urlArgs: "v=" + window.buildNumber,
    paths: {....}
});
Run Code Online (Sandbox Code Playgroud)

然后每次更改JS源代码或模板html时,我只需要在全局范围内更新"buildNumber".这只是对生产环境中未来更新的一种思考.希望这可以帮助.


kuc*_*ram 2

所以我找到的唯一解决方案是完全禁用 ajax 查询的缓存。我在这里找到了解决方案:https ://stackoverflow.com/a/19771501/607038

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';
}]);
Run Code Online (Sandbox Code Playgroud)

我不喜欢这个解决方案,因为它禁用了真正静态的内容的兑现。所以如果你有更好的解决方案而不是分享它。