Question

我尝试了解有关Observable的更多信息，并使用它们从网址获取一些json数据，但我对get方法有一些问题。我也想知道是否有另一种解决方案。

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));
}
}

Answer 1

无法读取未定义的属性'get'

您不会将http实例注入构造函数和Angular relies on dependency injection。添加以下内容并确保主模块已注册http模块，以便您可以将它们用于DI。从类定义中删除当前的http变量。

constructor(private http: Http) {}

在您的应用程序模块中，请务必从HttpModule

导入'@angular/http'

使用Angular observable和http

1 个答案: