将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后端如下：

Angular 4代码：

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'。请问有人可以解释一下这种行为吗？

我正在使用Typescript版本'~2.3.3'，我的'tsconfig.json'文件中将目标设置为'es5'。请问有人可以解释一下这种行为吗？

- KaustubhN

---

你能看一下这个 JavaScript 吗？我不确定是否可以在 ES5 中使用 Map。我想知道为什么你没有收到编译错误。 - Markus

检查你发送给服务器的内容。 （我假设数据发布被转换为某种类似于数组对象的方式）。 无论如何，在发送和接收之前，我将尝试将地图转换为对象数组。 - Eliseo

你遇到了同样的问题吗？最终找到解决方案了吗？ - Peter

Answer 1

您需要将Map转换为键值对数组，因为Typescript中的Map不能直接在http post请求体内使用。

您可以按以下方式进行转换：

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();
})

- rvangijlswijk

---

如果map嵌套在许多对象的内部，深度达到5层会怎样？ - 10101010

Answer 2

你可以创建一个以键为属性的对象。以下是一个包含两个项的地图示例：

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

- Amine Aouffen