Beispielpraxis für Angular5 httpclient

Dieser Artikel stellt hauptsächlich die praktischen Beispiele von angle5 httpclient vor. Jetzt teile ich ihn mit Ihnen und gebe ihn als Referenz.

Httpclient wird seit Angular 4.3.0 und höher verwendet und ersetzt das vorherige http, und der referenzierte Paketpfad hat sich in angle/common/http geändert

Ein einfaches httpclient-Beispiel

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: &#39;json&#39;
  };
  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: &#39;json&#39;
  };
  return this.httpClient.request(Service.METHOD_GET, url, options);
 }
}

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

Detaillierte Erläuterung der benutzerdefinierten dynamischen Komponenteninstanzen von Vue

Einführung in Time-Sharing-Funktionen zur Optimierung der Javascript-Leistung

Überprüfung des E-Mail-Adressformats in JavaScript

Das obige ist der detaillierte Inhalt vonBeispielpraxis für Angular5 httpclient. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!