将 Typescript "Map" 作为 Angular4 HTTP POST 请求的一部分传递

Question

我有一个 Angular 4 项目，我正在其中创建示例地图，如下所示：

let sampleMap = new Map<string, string>();
sampleMap.set('key1','value1');

现在我将此 Map 作为参数传递给 Angular 4 Post 方法，该方法连接到 Spring Boot Rest 后端，如下所示

Angular4码:

this.http.post('http://localhost:8080/data/posturl', sampleMap).map((response: Response) => {
      return <string>response.text();
    })

Spring Boot Rest 后端代码：

@RequestMapping("/posturl")
public String launch(@RequestBody Map<String, String> sampleMap) {
    System.out.println("Received=" + sampleMap);
    return "SUCCESS";
}

尽管当我尝试打印如上所示的 'sampleMap' 时，它会打印如下空白地图：

Received={}

我使用的是 Typescript 版本“~2.3.3”，我的 'tsconfig.json' 提到的目标是 'es5'。有人可以解释一下这种行为吗？

Answer 1

您必须将映射转换为键值对数组，因为无法在 http post 正文中直接使用 Typescript 映射。

您可以按如下方式转换地图：

const convMap = {};
sampleMap.forEach((val: string, key: string) => {
  convMap[key] = val;
});
this.http.post('http://localhost:8080/data/posturl', convMap).map((response: Response) => {
  return <string>response.text();
})

Answer 2

您可以创建一个以键作为属性的对象。包含 2 个项目的地图示例：

let myObject = {"key1":"value1","key2":"value2"};
this.http.post('http://localhost:8080/data/posturl', myObject ).map((response: Response) => {
      return <string>response.text();
    })

将 Typescript "Map" 作为 Angular4 HTTP POST 请求的一部分传递

Passing Typescript "Map" as a part of Angular4 HTTP POST request

typescript

angular

angular4-httpclient