如何在Angular 2中调用简单的http GET服务
我正在学习Angular 2,并尝试在页面加载时调用一个简单的HTTP Get请求来获取我拥有的JSON数据,并在页面加载时操作该JSON。有谁能告诉我一些基本的例子如何做到这一点?我在网上看到的大多数解决方案都是Beta版。要获得可观察的结果,您可以按照下面的示例进行操作。如何在Angular 2中调用简单的http GET服务,angular,angular2-http,Angular,Angular2 Http,我正在学习Angular 2,并尝试在页面加载时调用一个简单的HTTP Get请求来获取我拥有的JSON数据,并在页面加载时操作该JSON。有谁能告诉我一些基本的例子如何做到这一点?我在网上看到的大多数解决方案都是Beta版。要获得可观察的结果,您可以按照下面的示例进行操作。getStories方法使用注入的HTTP服务并返回一个可观察的,可进一步用于获取响应 @Injectable() export class StoriesService { constructor(private
getStories
方法使用注入的HTTP服务并返回一个可观察的,可进一步用于获取响应
@Injectable()
export class StoriesService {
constructor(private http:Http,private constService :ConstantsService) { }
public getStories()
{
this.http
.get(this.constService.apiBaseUrl + "Stories/Stories")
.subscribe ((data: Response) => console.log(data));
}
}
这是一个简单的HTTP Get服务示例。创建如下服务:
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import 'rxjs/Rx';
import {Observable} from 'rxjs/Rx'
export class MyService {
constructor(public http: Http) { }
private extractData(res) {
if (res.status < 200 || res.status >= 300) {
throw new Error('Bad response status: ' + res.status);
}
// console.log(res.json());
this.serviceData = (res.json());
return this.serviceData || {};
}
loaddata(): Observable<any> {
return this.http.get(this.server_url) // define a variable server_url to assign the requested url
.map(this.extractData);
}
}
在.map()之后使用.subscribe是否总是很重要?@techiequestie,是的,这很重要。由于API(例如,
loaddata
返回一个可观察数据),我们需要订阅它以实际执行http请求。
class MyComponent{
constructor(public _myService: MyService)
ngOnInit(){
this._myService.loaddata().subscribe(data => {
// do something with the data
})
}
}