使用AngularJS静态文件加载器时如何优雅地处理丢失的翻译文件？

Question

如果您的useStaticFilesLoader 定义中有多个规则，其中一个是丢失的文件夹，即使未使用包含在丢失文件中的翻译，角度翻译也会失败。

例如，我用错误的 foo 名称替换了实际的 prompts 文件夹名称。如果您恢复正确的文件夹名称，一切正常。

$translateProvider.useStaticFilesLoader({
    files: [{
      prefix: 'lang_',
      suffix: '.json'
    }, {
      prefix: 'foo/lang_',
      suffix: '.json'
    }]
  });

Plunk example

有没有办法忽略丢失的文件并继续使用其他文件？

Answer 1

一个可能的解决方案是使用custom loader 而不是标准的静态加载器。

app.factory('translationLoader', function ($q, $http) {
  return function (options) {
    var deferred = $q.defer(),
      translations;

    $http.get('lang_' options.key + '.json')
      .then(function (res) {
        translations = res.data;

        $http.get('subfolder/lang_' + options.key + '.json')
          .then(function (res) {
            translations = translations.concat(res.data);
          }, function () {
            deferred.resolve(translations);
          })
          .finally(function () {
            deferred.resolve(translations);
          });
      }, function () {
        deferred.reject(options.key);
      });

    return deferred.promise;
  };
})
.config([
  '$translateProvider',
  function ($translateProvider) {
    $translateProvider
      .useSanitizeValueStrategy(null)
      .useLoader('translationLoader');
  }
]);