How to use $cookies to cache bust Angular 翻译静态文件

Question

这里的核心问题是我无法将 $cookies 注入到配置块中，并且在 Angular Translate 中配置静态文件加载似乎只能在配置块中完成。我有一个包含我的应用程序版本的 cookie，我想将其用作我的静态翻译文件的查询参数，以便在版本之间进行缓存清除。

代码如下：

(function( ) {
    'use strict';

    angular.module( 'vcp.core' ).
        config( configureTranslationResources );

    function configureTranslationResources( $translateProvider ) {

        var $cookies;
        angular.injector(['ngCookies']).invoke(['$cookies', function(_$cookies_) {
            $cookies = _$cookies_;
        }]);

        var vcpVersion = $cookies ? $cookies.get('vcp-version') : '';

        $translateProvider.useStaticFilesLoader({
            prefix: '/v2/assets/i18n/',
            suffix: '.json?v=' + vcpVersion
        });

    }

})( );

这感觉很奇怪，应该有更好的方法。我无法从 Angular Translate 文档中了解如何在运行块中配置静态文件加载（并不是那种感觉比这种方法好得多），而且似乎没有办法通过 $cookiesProvider 获取配置块中的 cookie。

也许这种方法完全是个坏主意，有更好的方法来解决这个问题吗？

Answer 1

如果您的页面是动态生成的，您可以将版本号放在 HTML 而不是 cookie 中。例如，在 index.html 单页应用程序中：

<script>
'use strict';
angular.module('vcp.settings', [])
.constant('vcpVersion', '{{vcp_version}}');
</script>

其中 vcp_version 是在服务器端注入的。由于它在部署期间是静态的，因此您的服务器可以缓存生成的 HTML.

常量在配置期间可用，因此您可以像这样将版本号注入配置函数：

angular.module( 'vcp.core', ['vcp.settings'] ).
    config( configureTranslationResources );

function configureTranslationResources( $translateProvider, vcpVersion ) {
    ...

How to use $cookies to cache bust Angular 翻译静态文件

How to use $cookies to cache bust Angular Translate static files

angularjs

angular-translate

angular-cookies