将 translateProvider.useLoader 与打字稿一起使用

Question

我是 AngularJs 和 Typescript 的新手。我正在尝试实施 I18n。我的资源包位于远程服务器中。我使用 $translateProvider.useLoader('TranlationFilesLoader',{}) ，其中 TranlationFilesLoader 是自定义加载器 class.

TranlationFilesLoader class 如下所示：

export class TranlationFilesLoader  {
    public static $inject = ['$http', '$q' ];

    constructor( $http: ng.IHttpService , $q: ng.IQService, options: any ) {

      var deferred = $q.defer();
      var currentLocale = options.key;
      var proxyurl = '/content?locale='+currentLocale;
      var req = {
         method:'GET',
         url: proxyurl ,
         }
      };
      $http(req).then(
        function(result) {
          deferred.resolve(result.data);
        },
        function(){
          deferred.reject(options.key)
        }
      );
      return deferred.promise;
    }
  }

在模块配置中我写了以下内容..

.config(function ($translateProvider : ng.translate.ITranslateProvider) {
    $translateProvider.useLoader('TranlationFilesLoader', {});
    $translateProvider.preferredLanguage('en_us');// is applied on first load
    $translateProvider.useLocalStorage();// saves selected language to localStorage
  })

工厂我也注册过

.factory('TranlationFilesLoader', TranlationFilesLoader)

我得到的错误是：未捕获错误：[$injector:undef] 提供程序 'TranlationFilesLoader' 必须 return 来自 $get 工厂方法的值。

有人试过这个吗？我被困在不同的地方。请帮忙。谢谢

Answer 1

为了使用 $translateProvider.useLoader('TranlationFilesLoader', {});，您必须用 angular 注册名称 TranlationFilesLoader。

在您的情况下，请执行：.service('TranlationFilesLoader', TranlationFilesLoader ); 在代码中的相关位置。

Answer 2

一个愚蠢的错误是不允许我检索选项的值。

工作代码如下

export class TranslationFilesLoader  {

public static $inject = ['$http', '$q' ];

constructor( $http: ng.IHttpService , $q: ng.IQService) {

   return function (options) {
      var deferred = $q.defer();
      var currentLocale = options.key;
      var proxyurl = '/content?locale='+currentLocale;
      var req = {
         method:'GET',
         url: proxyurl ,
      };
     $http(req).then(
       function(result) {
         deferred.resolve(result.data);
       },
       function(){
        deferred.reject(options.key)
       }
     );
    return deferred.promise;
  }
}

将 translateProvider.useLoader 与打字稿一起使用

Use translateProvider.useLoader with Typescript

typescript

angular-translate