我在一个相当大的角度项目上使用角度翻译。我将项目分解成多个模块,使其更易于管理,但是我无法分解每个模块的翻译字符串。
例如,我有模块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
官方文件可以在这里找到: 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; }; });