如何處理TypeScript中的閉包（角度注入）？

Question

我在JavaScript中定義了一個Angular工廠服務，如下所示：

app.service('MyServiceFactory', ['$http', '$timeout', '$interval',
  function($http, $timeout, $interval) {

  function MyService() {
    // I can use all injected values here without additional efforts
  }

  this.Create = function() {
    return new MyService();
  }

}]);

現在，我想將其轉換為TypeScript：

module Services {

  export class MyServiceFactory {
    static $inject: string[] = ['$timeout', '$interval', '$http'];

    constructor(
      private timeout: angular.ITimeoutService,
      private interval: angular.IIntervalService,
      private http: angular.IHttpService) {
    }
    public create(): MyService { return new MyService(); };
  }

  export class MyService() {
    // I have a problem here. I need to redefine and
    // initialize all variables, injected into my factory class
  }

  angular.module('MyModule').service('MyServiceFactory', MyServiceFactory);
}

你明白我的意思嗎？ TypeScript不允許使用嵌套類，而嵌套類可以解決此問題。 此外，TypeScript解決方案看起來也很酷。 有沒有更優雅的解決方案？

Answer 1

代替 ：

export class MyService() {
    // I have a problem here. I need to redefine and
    // initialize all variables, injected into my factory class
  }

您可以將Create放在MyServiceFactory即：

module Services {

  export class MyServiceFactory {
    static $inject: string[] = ['$timeout', '$interval', '$http'];

    constructor(
      private timeout: angular.ITimeoutService,
      private interval: angular.IIntervalService,
      private http: angular.IHttpService) {
    }
    public create(){ 
      // Use the revealing module pattern 
      // And let the compiler infer the return type
      // e.g.
      var foo = 23;
      return {
         foo
      }
    };
  }

  angular.module('MyModule').service('MyServiceFactory', MyServiceFactory);
}

請注意，有效的JavaScript是有效的TypeScript（ 更多 ）

Answer 2

您可以將注入的變量作為參數傳遞給其他類，例如：

export class MyServiceFactory {
  static $inject: string[] = ['$timeout', '$interval', '$http'];

  constructor(
    private timeout: angular.ITimeoutService,
    private interval: angular.IIntervalService,
    private http: angular.IHttpService) {

  }

  public create(): MyService {
    return new MyService(this.timeout, this.interval, this.http);
  }
}

export class MyService {
  constructor(
    private timeout: angular.ITimeoutService,
    private interval: angular.IIntervalService,
    private http: angular.IHttpService) {
    // no more problems here, you can play with the injected variables again
  }
}

angular.module('MyModule').service('MyServiceFactory', MyServiceFactory);