Question

我是Angular的新手，在使用Angular httpClient和HttpParams从服务器获取数据时遇到问题。

整个uri指定有效，但这不是我想要的解决方案。我尝试使其与HttpParams对象一起使用。

我正在使用Angular6

在以下代码段中，只有HttpParams不同

以下代码有效：

addBidirectionalSynonym(dialectLanguage: string, entryId1: string, entryId2: string) {


    this.http
      .post("http://localhost:8090/dialect/addBidirectionalSynonyms?dialectLanguage=tirolerisch&id1=5d1221893269a28de043edaf&id2=5d1221923269a28de043edb1", { ///dialectLanguage=tirolerisch

      })
      .toPromise()
      .then((data: any) => {

      })
// catch Block is the same in both examples
      .catch(err => {
        if (err.status === 200 || err.status === 201) {
          console.log("Created entry. ", err.status);

          return;
        }

        if (err.status === 401 || err.status === 403) {
          console.error("You may have no internet connection");
        }
        if (err.status === 500) {
          console.error("Server error. Please contact admin", err.status);
        }
        return;
      });
  }

以下代码无效：


  addBidirectionalSynonym(dialectLanguage: string, entryId1: string, entryId2: string) {
    console.log("inserting synonym::::::", dialectLanguage, entryId1, entryId2);


    let params1 = new HttpParams()
      .set("dialectLanguage", dialectLanguage)
      .set("id1", entryId1)
      .set("id2", entryId2);
    console.warn("params: ", params1);

    this.http
      .post("http://localhost:8090/dialect/addBidirectionalSynonyms", { 
        params: params1
      })
      .toPromise()
      .then((data: any) => {

      })
// catch Block is the same in both examples
      .catch(err => {
        if (err.status === 200 || err.status === 201) {
          console.log("Created entry. ", err.status);

          return;
        }

        if (err.status === 401 || err.status === 403) {
          console.error("You may have no internet connection");
        }
        if (err.status === 500) {
          console.error("Server error. Please contact admin", err.status);
        }
        return;
      });
  }

http方法被这样调用：

  this.service.addBidirectionalSynonym(this.data.language, this.data.dialectId, row.dialect.dialectId);

服务器上的失败消息：

Resolved [org.springframework.web.bind.MissingServletRequestParameterException: Required String parameter 'dialectLanguage' is not present

从客户端生成的网址：


{"params":{"updates":[{"param":"dialectLanguage","value":"tirolerisch","op":"s"},{"param":"id1","value":"5d12218d3269a28de043edb0","op":"s"},{"param":"id2","value":"5d12219c3269a28de043edb3","op":"s"}],"cloneFrom":{"updates":null,"cloneFrom":null,"encoder":{},"map":null},"encoder":{},"map":null}}

我不知道这个“ op”应该做什么

Answer 1

根据您的第一种方法，参数应使用类似/addBidirectionalSynonyms?dialectLanguage=tirolerisch&...的URL。

第二种方法this.http.post(endpointUrl, {params: params1})中，您将正文传递给HTTP POST，但没有URL中的参数。

要执行所需的操作，您需要执行以下操作：

this.http
  .post("http://localhost:8090/dialect/addBidirectionalSynonyms", null, { 
                                                                  ^^^^^
    params: params1
   })
   ...

因为您没有HTTP正文。

检查Angular documentation以获得更多信息。

无法使用HTTPParams对象执行发布请求

1 个答案: