我正在尝试使用 Angular 2 Http 从 REST 网络服务获取数据。
我首先在调用它的客户端组件类的构造函数中注入(inject)服务:
constructor (private _myService: MyService,
private route: ActivatedRoute,
private router: Router) {}
我添加了一个调用 MyService 方法的 getData() 方法来从网络服务中获取数据:
getData(myArg: string) {
this._myService.fetchData(myArg)
.subscribe(data => this.jsonData = JSON.stringify(data),
error => alert(error),
() => console.log("Finished")
);
console.log('response ' + this.jsonData);
我在客户端组件类的 ngOnInit 方法中调用了 getData() 方法(我正确导入并实现了 OnInit 接口(interface)):
this.getData(this.myArg);
这是 MyService 服务:
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class MyService {
constructor (private _http: Http) {}
fetchData(myArg: string) {
return this._http.get("http://date.jsontest.com/").map(res => res.json());
}
}
我无法获取数据,当我尝试在上面的 getData() 方法中使用 console.log('response ' + this.jsonData);
测试它时,我得到在浏览器中响应未定义
。
PS:jsonData是客户端组件类的字符串属性。
最佳答案
由于 http 请求是异步的,this.jsonData
不会在您尝试将其记录到控制台时设置。而是将该日志放入订阅回调中:
getData(myArg: string){
this._myService.fetchData(myArg)
.subscribe(data => {
this.jsonData = JSON.stringify(data)
console.log(this.jsonData);
},
error => alert(error),
() => console.log("Finished")
);
}
关于javascript - 使用 Angular 2 Http 从 REST Web 服务获取数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38226919/