Как лучше всего организовать строки перевода в angular -трансляте?

Я использую angular -трансляцию в довольно большом проекте Angular. Я разбиваю проект на несколько модулей, чтобы сделать его более управляемым, но я не могу разбить строки перевода на модуль.

Например, у меня есть модули A и B, где B - подмодуль A. Существуют строки, относящиеся к HTML, охватываемому модулем A, которые помещаются в '/json/localization/A/en.json', Точно так же есть строки, относящиеся к B, которые я помещаю в '/json/localization/B/en.json'. Сначала я загружаю B en.json в модуль B, используя angular -транслят $translationProvider. Затем загружаю модуль 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'
])

Ответы

Ответ 1

angular -translate поддерживает асинхронную загрузку файлов с частичным языком. Все частичные файлы объединены в один словарь на каждый язык. Официальную документацию можно найти здесь: http://angular-translate.github.io/docs/#/guide/12_asynchronous-loading

Он поддерживает применение шаблона для шаблонов url, которые указывают на модулированные языковые файлы:

$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;  
  };
});