angular5 httpclient的示例实战

一个基础的 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); ?}}