怎么让angular httpclient.post请求的body参数为键值对的形式？

Question

使用post请求时，传入的body参数是一个对象，得到的结果是这样：

我希望他是这样：

httpService中的代码：

 private headers = new HttpHeaders({
     "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8"
  });
login() {
    let bo = {
      a: "参数1",
      b: "参数2"
    };
    this.http
      .request(
        new HttpRequest("POST", "api/search/suggest/multimatch", bo, {
          headers: this.headers
        })
      )
      .subscribe(re => {
        console.log(re);
      });
   }

求哪位大佬指点指点。。

Answer 1

主要是因为前后端content-type设置不一致引起的；
在第三个参数中设置
headers: new HttpHeaders({'Content-Type': 'application/x-www-form-urlencoded'})
可以解决此问题

Answer 2

请问下，解决了吗？我目前也是。post后php拿不到参数

Answer 3

// 参数类型声明
interface ParamsType  {
  [propName: string]: any;
}


  /**
   * body为 urlencoding 的Post
   * @param _url|string 请求目标URL
   * @param _params|ParamsType 参数对象
   */
  Post(_url: string, _params: ParamsType): Observable<any> {
    const URL = environment.baseURL + _url;
    let messageId = this.commonService.showResponseMsg(this.ResponseMsgContent.add);
    const params = new HttpParams({
      fromObject: _params
    });
    return this.httpClient.post(URL, params, {
      headers: new HttpHeaders({
        'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
      })
    }).pipe(
      map((res: HttpResponse) => {
        this.message.remove(messageId);
        if (res.code === StateCode.ok) {
          this.message.success(res.msg);
          return res;
        } else {
          this.message.error(res.msg);
        }
      }),
      catchError(this.handleError)
    );
  }

代码如上，最重要的代码就是使用 HttpParams 将对象转变为键值对，然后放进 HttpClient 的 post 函数的第二个参数，同时设置 HttpHeaders

Answer 4

使用$.param(data)为body.

this.http.post("api/search/suggest/multimatch", $.param(data), {
        params:  params,
        headers: this.headers
      })
      .subscribe(re => {
        console.log(re);
      });

 http://blog.csdn.net/maoguiyou/article/details/51891499