angular5 httpclient的示例实战

angular5 httpclient的示例实战

从angular 4.3.0 以后的版本开始使用httpclient，替换了之前的http，引用的包路径已经变为了angular/common/http了

一个基础的 httpclient 样例

import { Injectable } from '@angular/core';

import { HttpClient, HttpResponse } from '@angular/common/http';

import { Observable } from 'rxjs/Observable';

import { HttpDefaultOptions } from './http.default.options';

@Injectable()

export class Service {

private static METHOD_DELTE = 'DELETE';

private static METHOD_POST = 'POST';

private static METHOD_GET = 'GET';

private static METHOD_PUT = 'PUT';

constructor(private httpClient: HttpClient) {

}

/**

* 将数据上传

* @param data

* @param {Function} func

*/

uploadDataPost(data: any, func: Function) {

let url = '/api/test';

this.apiPost(url, data)

.subscribe((response: HttpResponse) => {

func(response);

}, error => {

func(undefined);

});

}

/**

* 返回json 格式的obj 对象

* @param url

* @param body

* @param urlSearchParams

* @returns {Observable<{}>}

*/

apiPost(url, body, urlSearchParams?: any): Observable<{}> {

let options = {

body: body ? body : null,

params: urlSearchParams,

responseType: 'json'

};

return this.httpClient.request(Service.METHOD_POST, url, options);

}

/**

* 返回一个obj 对象

* @param url

* @param urlSearchParams url 的查询参数

* @returns {Observable<{}>}

*/

apiGet(url, urlSearchParams?: any): Observable<{}> {

let options = {

params: urlSearchParams,

responseType: 'json'

};

return this.httpClient.request(Service.METHOD_GET, url, options);

}

}

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。