使用es5將Http插入Angular2服務

Question

我正在使用Angular2和es5。 我想在服務中使用http。 不幸的是，我有2個錯誤：-http未定義，但是ng.http.Http被定義，-主要組件出現此錯誤：

vendor-client.min.js:28 EXCEPTION: Can't resolve all parameters for class0: (t, ?)

這是我的服務代碼：

;(function(app, ng) {
  console.log(new ng.http.Http());

  app.ApplicationsService = ng.core.Injectable().Class({
    constructor: [ng.http.Http, function(http) {
      console.log(http);
      this.applicationsEmailUrl = 'api/applications/email';
      this.http = http;
    }],

    emailExists: function(email) {
      console.log(email);
      var data = { email: email };
      return this.http.post(this.applicationsEmailUrl, data)
        .toPromise()
        .then(function(response) { response.json().data; })
        .catch(this.handleError);
    }

  });

})(window.app || (window.app = {}), window.ng);

這是主要組成部分：

;(function(app, ng) {

  app.AppComponent = ng.core
    .Component({
      selector: 'register-form',
      templateUrl: 'src/register/app.component.html'
    })
    .Class({
      constructor: [ng.core.ElementRef, app.ApplicationsService, function(ref, Applications) {
        console.log('app.component.js');
        this.programs = JSON.parse(ref.nativeElement.getAttribute('programs'));
        this.applications = Applications;
      }],
      emailExists: function(email) {
        console.log('emailExists() triggered');
        Applications.emailExists(email);
      }
    });

})(window.app || (window.app = {}), window.ng);

引導程序：

;(function(app, ng) {

  document.addEventListener('DOMContentLoaded', function() {
    ng.platformBrowserDynamic.bootstrap(app.AppComponent, [
      ng.forms.disableDeprecatedForms(),
      ng.forms.provideForms(),
      ng.http.HTTP_PROVIDERS,
      app.ApplicationsService
    ]);
  });

})(window.app || (window.app = {}), window.ng);

如果我嘗試將http注入providers數組內的主要組件中，它將起作用。 但是我更願意提供服務。

Answer 1

我發現了問題。 看起來Angular2需要按順序加載代碼。 主要組件在服務之前已加載，因此未定義。 我將所有代碼都放在一個文件中，並且可以正常工作。 我將盡快使用require loader。