2016-05-09 77 views
1

如何在ES5代碼中使用Angular2提供的HTTP服務? Here是TypeScript示例。在ES5代碼中使用Angular2 HTTP服務

我基本上需要GET和POST請求的例子。

示例here不起作用。 get似乎是未定義的。

這裏是行不通的例子:

var SearchResultComponent = ng.core.Component({ 
     selector: "search-result", 
     viewProviders: [ng.http.HTTP_PROVIDERS], 
     templateUrl: "componentTemplates/SearchResult.html" 
    }).Class({ 
     constructor: [ng.http.HTTP_PROVIDERS, function(http) { 
      this.params = params; 
      this.http = http; 
     }], 
     ngOnInit: function(){ 

      console.log(this.http.get); //undefined 
     } 
    }) 
+0

您可以通過添加演示您所嘗試的代碼和確切的錯誤消息的代碼來使其成爲一個有效的問題。證明這個問題的Plunker也不會傷害。 –

+0

完成。編輯帖子並添加了一個例子。 –

回答

0

在你SearchResultComponent組件的構造函數,你需要使用ng.http.Http而不是HTTP提供商:

var SearchResultComponent = ng.core.Component({ 
    selector: "search-result", 
    viewProviders: [ng.http.HTTP_PROVIDERS], 
    templateUrl: "componentTemplates/SearchResult.html" 
}).Class({ 
    constructor: [ng.http.Http, function(http) { // <----- 
     this.params = params; 
     this.http = http; 
    }], 
    ngOnInit: function(){ 

     console.log(this.http.get); //undefined 
    } 
}); 

在你的情況下,不是被注入的Http對象...

提供者可以在使用providers屬性或viewProviders屬性(與您一樣)。

看到這個plunkr使用HTTP與Angular2和ES5:https://plnkr.co/edit/oM4gTgW5Q7gpR8Qderjj

+0

viewProviders和分配給構造函數的數組值之間有什麼區別。我的意思是HTTP_PROVIDERS和ng.http.Http之間的區別? –

+0

viewProviders/providers允許你定義提供者(負責創建事物實例的實體)和構造器參數到你要注入的東西(即由提供者創建的對象) –

+0

'HTTP_PROVIDERS'是HTTP的提供者,'ng.http.Http '你要注入的對象的類型。提供者之一知道如何創建這種類型的實例... –