角度平移和ngRoute $routeParams

Angular-translate and ngRoute $routeParams

本文关键字:ngRoute routeParams      更新时间:2023-09-26

我正在使用角度翻译来添加 3 种语言(英语、葡萄牙语和西班牙语(的支持,一切正常。

    // config angular translate
app.config(['$translateProvider', function ($translateProvider) {
  // configures staticFilesLoader
  $translateProvider.useStaticFilesLoader({
    prefix: 'translations/locale-',
    suffix: '.json'
  });
  $translateProvider.preferredLanguage('en');
}]);
这样,我就有了 3 个

文件,其中包含 3 种语言的所有翻译。但我现在面临的问题是,

如果我需要使用 ngRoute 转换来自 json 文件并通过 $routeParams 动态更改的数据,该怎么办?

这是我在进入 i18n 之前所做的

// MyController
app.controller('MyController', ['$scope', '$routeParams', '$http',
    function($scope, $routeParams,  $http) {
        $http.get('someFolder/' + $routeParams.itemId + '.json').success(function(data) {
            $scope.item = data;
        });
    }]);

其中一个 json 文件

{
  "id": "blue",
  "color": "Blue",
  "description": "The color blue is one of trust, honesty and loyalty"
 }

我有一个包含 json 文件的文件夹,它加载了项目的 ID。 我的 HTML 看起来像这样:

<dl class="dl-horizontal" ng-controller="MyController">
    <dt>{{ 'item.label.color' | translate }}</dt>
    <dd>{{ item.color }}</dd>
    <dt>{{ 'item.label.description' | translate }}</dt>
    <dd>{{ item.description }}</dd>
</dl>

我能够翻译项目的标签,因为它在所有 json 文件中始终相同,但我实际需要的是翻译值。

有什么解决方案吗?

提前致谢

而不是静态文件加载器,看看 PartialLoader。这允许您将模板分解为多个部分,并单独请求每个部分。

$translateProvider.useLoader('$translatePartialLoader', {
    urlTemplate: '{part}/i18n/{lang}.json',
    loadFailureHandler: 'TranslationErrorHandler'
});

有了这个,你做

$translatePartialLoader.addPart('common');

这将加载"common/i18n/.json">