Question

目前，我正在使用Angular 2.我尝试在ES5中使用Http，但无法使其正常工作。错误说“Http未定义”。

这是我的代码：

function Service() {}
Service.prototype.greeting = function() {
  return 'Hello';
};

var Cmp = ng.
  Component({
    selector: 'cmp',
    providers: [Service],
    directives: [ng.NgFor],
    injectors: [ng.Http, ng.HTTP_PROVIDERS],
    templateUrl: 'hello.html'
  }).
  Class({
    constructor: [Service, function Cmp(service) {
      this.greeting = service.greeting();
      ng.Http.get('people.json');
    }],
  });

document.addEventListener('DOMContentLoaded', function() {
  ng.bootstrap(Cmp);
});

有人可以帮我解决这个问题吗？谢谢。

Answer 1

我终于设法解决了自己的问题。

这是我的代码：

function Service() {}
Service.prototype.greeting = function() {
  return 'Hello';
};

var Cmp = ng.
  Component({
    selector: 'cmp',
    providers: [Service, ngHttp.HTTP_PROVIDERS],
    template: '{{greeting}}, {{result.name}}!'
  }).
  Class({
    constructor: [Service, ngHttp.Http, function Cmp(service, Http) {
      this.greeting = service.greeting();
      this.result = {};
      this.http = Http;
      this.mapPeople().subscribe(function(result){
        this.result = result;
      }.bind(this));
    }],
    mapPeople: function(){
      return this.http.get('people.json').map(function (res) {
              return res.json();
          });
    }
  });

document.addEventListener('DOMContentLoaded', function() {
  ng.bootstrap(Cmp);
});

结果是，Http对象在ngHttp中。我认为，由于Angular 2目前仍处于Alpha版本并且正在迅速变化，因此缺乏文档。我希望这能帮助那些遇到与我一样的问题的人。

Answer 2

对于Angular 2 Beta版，它按以下方式工作

(function(app) {

app.MyName = ng.core
  .Component({
    selector: 'my-name',
    template: '<span>Dave</span>',
    providers: [ng.http.HTTP_PROVIDERS]
  })
  .Class({
    constructor: [ng.http.Http, function(http) {

    }]
  });

app.HelloApp =
  ng.core.Component({
    selector: 'hello-app',
    template: '<h1>Hello Angular 2!</h1><my-name></my-name>',
    directives: [app.MyName]
  })
  .Class({
    constructor: function(){}
  });
})(window.app || (window.app = {}));

Answer 3

要使其与beta版本一起使用，我必须将ngHttp更改为ng.http

Angular 2：如何在ES5中使用Http？

3 个答案: