angular6 - 如何在进行 http post 服务调用时在正文中传递表单字段值

Question

处理Angular http post服务调用，并从java服务获取api，为了从该服务获取响应，我必须将数据/请求参数传递给url，我通过提供一个名为body的var然后传递这个带网址

我正在使用角度反应形式，并且从这里的表单字段中，我想将请求参数发送到正文就像当用户填写他提交的表单时，这作为请求，他从这些字段计算后获得了一定的数据回复

这是我的服务调用，我在其中传递硬编码值，但在这里我怎么能将 formcontrolname 值传递给正文？

    getPoll(): Observable<PollData[]> {
  const headers = new HttpHeaders({ 'Content-Type': 'application/json'});

  let body = '{"auth": { "accesskey": "", "signature": "" }, "data": { "v_age": 0, "v_rto_name": "Delhi East: Anand Vihar", "aa_status": false, "tax_type":"IGST","debug_flag":false }}';
  return this.http
  .post<PollData[]>(this.apiUrl + this.premiumUrl, body, { headers: headers })
    .pipe(
      tap(data => console.log('getPoll: ' + JSON.stringify(data))),
      catchError(this.handleError)
    );
}

当我传递硬编码值时，我得到一个响应，但是我怎样才能使它动态地从反应式表单字段中加载。

标签： angular6angular-reactive-formsangular-httpclient

Answer 1

您可以在组件服务调用中将表单值作为参数传递。

submitForm() {
 this.yourService.getPoll(this.yourForm.value).subscribe(...);
}

获取 getPoll 函数中的参数并

getPoll(yourFormValues): Observable<PollData[]> {
  const headers = new HttpHeaders({ 'Content-Type': 'application/json'});

  let body = '{"auth": { "accesskey": "", "signature": "" }, "data": { "v_age": yourFormValues.v_age, "v_rto_name": yourFormValues.v_rto_name, "aa_status": yourFormValues.aa_status, "tax_type":yourFormValues.tax_type,"debug_flag":false }}';
  return this.http
  .post<PollData[]>(this.apiUrl + this.premiumUrl, body, { headers: headers })
    .pipe(
      tap(data => console.log('getPoll: ' + JSON.stringify(data))),
      catchError(this.handleError)
    );
}