angularjs – 如何最好地组织翻译字符串的角度翻译？

发布时间：2020-12-17 08:22:34 所属栏目：安全来源：网络整理

导读：我在一个相当大的角度项目上使用角度翻译。我将项目分解成多个模块，使其更易于管理，但是我无法分解每个模块的翻译字符串。例如，我有模块A和B，其中B是A的子模块。有与模块A覆盖的HTML相关的字符串，它们放在’/json/localization/A/en.json’中。同样地

我在一个相当大的角度项目上使用角度翻译。我将项目分解成多个模块，使其更易于管理，但是我无法分解每个模块的翻译字符串。

例如，我有模块A和B，其中B是A的子模块。有与模块A覆盖的HTML相关的字符串，它们放在’/json/localization/A/en.json’中。同样地，有一些与B相关的字符串，我放在’/json/localization/B/en.json’中。首先，使用angular-translate的$ translationProvider在模块B中加载B的en.json。然后我加载模块A的en.json，也使用$ translationProvider。问题是加载A的字符串会覆盖B的字符串，并且它们丢失。

使用angular-translate，是否有一种方法来加载每个模块的字符串，而不会覆盖，或者父模块是否必须从单个en.json加载所有字符串？

这是一个例子(在coffeescript中)我如何加载翻译字符串：

my_module.config(['$translateProvider',($translateProvider) ->
  $translateProvider.useStaticFilesLoader
    prefix: '/json/localization/A/'
    suffix: '.json'

  $translateProvider.preferredLanguage 'en'
])

angular-translate支持部分语言文件的异步加载。所有部分被合并成一种字典每种语言。
官方文件可以在这里找到： http://angular-translate.github.io/docs/#/guide/12_asynchronous-loading

它支持为指向模块化语言文件的网址模板应用模板：

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

您可以在控制器中添加语言模块并刷新数据绑定，如下所示：

angular.module('contact')
  .controller('ContactCtrl',function ($scope,$translatePartialLoader,$translate) {  
      $translatePartialLoader.addPart('contact');
      $translate.refresh();
    });

当然，加载部分也可以在路由的解析阶段中被覆盖

或者，您还可以查看构建自己的自定义加载器功能。 http://angular-translate.github.io/docs/#/guide/13_custom-loaders

这提供了一个组合所需的语言模块所需的所有灵活性。例如。你可以这样做：

app.factory('customLoader',function ($http,$q) {
  // return loaderFn
  return function (options) {
    var deferred = $q.defer(); 
    var data = {
      'TEXT': 'Fooooo'
    };
    $http.get('nls/moduleA/en.json').success(function(moduleA){
      angular.extend(data,moduleA);
      $http.get('nls/moduleB/en.json').success(function(moduleB){
        angular.extend(data,moduleB);
        deferred.resolve(data);
      });
    });
    return deferred.promise;  
  };
});

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!