angular-translate 未使用加载的静态文件进行翻译答案

【问题标题】：angular-translate is not translating with loaded static fileangular-translate 未使用加载的静态文件进行翻译
【发布时间】：2014-08-20 01:35:10
【问题描述】：

我正在使用以下角度文件进行翻译：

angular-translate.min.js (v2.2.0)
angular-translate-loader-static-files.min.js (v2.2.0)
angular-translate-storage-cookie.min.js (v2.2.0)
angular-translate-storage-local.min.js (v2.2.0)
angular-cookies.min.js (v1.2.22)

angular-translate 在我执行以下操作时有效：

$translateProvider.translations('en_us', {
    "label.test": "It works."
});

但当我尝试使用静态文件时不会...

我的 HTML：

<html data-ng-app="myApp">
...
{{"label.test" | translate}}

我的 app.js：

var myApp = angular.module('myApp', ['ngCookies', 'pascalprecht.translate']).config(['$translateProvider', function($translateProvider) {
    $translateProvider.preferredLanguage('en_us');
    $translateProvider.useStaticFilesLoader({
        prefix: '/app/resources/messages/i18n_',
        suffix: '.json'
    });
    $translateProvider.useLocalStorage();
    $translateProvider.storageKey('lang');
}]);

我的获取响应（Content-Type 设置为：application/json）：

{
    "label.test":"It works from JSON."
};

呈现的 HTML 页面显示：label.test

此外，我的控制台中没有错误。我也尝试将密钥重命名为 TEST，但这也不起作用。

有什么想法吗？

谢谢。

【问题讨论】：

如果您使用翻译指令而不是过滤器会发生什么。 <p translate="label.test"></p>

标签： angular-translate

【解决方案1】：

检查 .json 的路径是否正确。如果找不到，在您的模板中，它只会打印出label.test，而不是像它正在做的那样实际翻译It works from JSON.。

您的应用程序根很可能是应用程序，因此如果您的翻译文件位于/app/resources/messages/i18n_en_us.json，请尝试：

$translateProvider.useStaticFilesLoader({
    prefix: '/resources/messages/i18n_',
    suffix: '.json'
});

还要确保您的 JSON 是有效的 JSON。去掉末尾的分号。

{
    "label.test":"It works from JSON."
}

【讨论】：

嗨 BigHeadCreations - 它是分号。我删除了它，以下两个现在都可以工作：{{"label.test" | translate}} 和 <p translate="label.test"></p> 非常感谢！
我知道这是一篇较旧的帖子，但只是再次添加它..路径正确非常重要..如果您不确定..您可以尝试将其放入您的浏览器并尝试找出正确的路径，直到出现某些内容..或者在您的浏览器调试中查看 network-> XHR 下的 json 文件是否显示正确的内容，那么您确定您设置的路径是正确的。