angular使用Http和HttpClient设置查询参数的区别

来源：互联网发布：java lucene 内容搜索编辑：程序博客网时间：2024/06/07 03:54

由于Angular的版本更新,里面Http将逐渐被HttpClient替代,所以Http中的一些方法在HttpClient中是无法使用的,这里就遇到一个设置查询字符串之间的差别

使用Http方法设置查询字符串

 import {   RequestOptions,   Headers,   Http } from '@angular/http'; constructor(http: Http) {};release() {let headers=new Headers({ 'Content-Type': 'application/x-www-form-urlencoded' }); //第一处区别let options=new RequestOptions({ headers: headers }); //第二处区别let params=newURLSearchParams();params.append("orderId",this.orderId);params.append("message", this.message);params.append("grade", this.star);for(leti=0; i<this.imgs.length; i++) {params.append("url[]", this.imgs[i]);}letbody=params.toString();console.log(body);this.http.post('http://api.xxxxxx.bpiao.com/ERP-Web/ceshi/order/xxxxxx', body, options).subscribe(data => {console.log(data);this.location.back();})}

使用HttpClient方法设置查询字符串

import {   HttpClient,   HttpParams,   HttpHeaders } from '@angular/common/http';constructor(http: HttpClient) {};release() {let headers=new HttpHeaders({ 'Content-Type': 'application/x-www-form-urlencoded' }); // 第一处区别let options= {headers: headers}; //第二处区别let params=newURLSearchParams();params.append("orderId",this.orderId);params.append("message", this.message);params.append("grade", this.star);for(leti=0; i<this.imgs.length; i++) {params.append("url[]", this.imgs[i]);}let body=params.toString();console.log(body);this.http.post('http://api.xxxxxx.bpiao.com/ERP-Web/ceshi/order/xxxxx', body, options).subscribe(data => {console.log(data);this.location.back();})}

这里导入包和实例HttpClient的区别我们在此不做讨论,照着文档里的操作就可以完成,主要看release()方法区别的解决方法我们需要看看post方法的源码

post(url: string, body: any | null, options?: {headers?: HttpHeaders; //这里方法便是解决所有区别的关键observe?: 'body';params?: HttpParams;reportProgress?: boolean;responseType?: 'json';withCredentials?: boolean;}): Observable<Object>;

如果大家有更好的解决方法欢迎留言

阅读全文

0 0