使用Angular observable和http

我嘗試瞭解更多關於Observable的信息，我使用它們從url獲取一些json數據，但是我有一些get方法的問題。另外我想知道如果有這個問題的另一個解決方案。使用Angular observable和http

import { Component , ViewChild , AfterViewInit } from '@angular/core'; 
import {Observable} from 'rxjs/Rx'; 
import {Http} from '@angular/http'; 
@Component({ 
selector: 'app-root', 
template: `<h1>Hello World!</h1> 
      <input type="text" #name > 
      `, 


}) 

export class AppComponent implements AfterViewInit{ 
@ViewChild ('name') input; 

constructor(private http: Http){} 

ngAfterViewInit(){ 

    var keyup = Observable.fromEvent(this.input.nativeElement,"keyup") 
          .map((data: any) => data.target.value) 
          .filter(text => text.length >= 3) 
          .distinctUntilChanged() 
          .debounceTime(400) 
          .flatMap(result => { 
          var url = "https://freemusicarchive.org/api/trackSearch?limit=10&q="+result; 
          var res = this.http.get(url).map(data => {data.json()}); 
          return res 
          }); 
    keyup.subscribe(data => console.log(data)); 
} 
}

來源

2017-06-14 M.J

它說導入HttpModule：無法讀取屬性「得到」的未定義 –

你永遠不注入HTTP是：http;進入你的構造函數。 – Igor

無法讀取的不確定

屬性 'GET' 你不注入http實例到你的構造和Angular relies on dependency injection。添加以下內容並確保主模塊已註冊http模塊，以便您可以將它們用於DI。從類定義中刪除當前的http變量。

constructor(private http: Http) {}

在您的應用程序模塊確保您從'@angular/http'

來源

2017-06-14 15:39:36 Igor

我補充說，但現在我得到錯誤後，將http添加到我的app.module.ts：模塊'AppModule'導入的意外值'Http'。請添加@NgModule註釋。 –

@ M.J - 請閱讀我答案的最後一句。您必須在您的應用程序模塊中導入'HttpModule'以使用'http'服務。 – Igor

感謝您的回覆，你知道任何其他方式，而不是http，我能從上面的url得到json結果嗎？ –

使用Angular observable和http

回答

相關問題