在从 Rest API 接收的 Angular6 中显示 HashMap<String, Object>答案

【问题标题】：Display HashMap<String, Object> in Angular6 received from Rest API在从 Rest API 接收的 Angular6 中显示 HashMap<String, Object>
【发布时间】：2020-03-13 16:49:38
【问题描述】：

我正在尝试显示从我的控制器接收到的 HashMap 的内容，但是我得到一个空地图。

这是我的控制器：

@PostMapping(value = "getAllUsers")
public HashMap<String, Object> getAllUsers(@RequestBody String s)
{
    List<User> list = userRepository.getAll(s);

    HashMap<String, Object> userList = new HashMap<String, Object>();
    userList.put("list", list);
    userList.put("total", list.size());

    return userList;
}

这是我的角度代码：

 getUsers() {

    this.userService.getUsers("canada").subscribe((data) => {
        console.log(data); // this returns an empty object
        data.forEach((value: string, key: string) => { // returns an error which is forEach is not a function
            console.log(key, value);
        });
        this.userList = data; // empty
        console.log(this.userList);
    });
}

这是我的 api 服务：

let URL = "api/v1";
getUsers(country: String): Observable<any> {
    return this.http.post(URL + "getAllUsers", country);
}

我想知道如何操作和迭代从我的控制器接收到的 HashMap。提前谢谢你。

【问题讨论】：

尝试使用http.get() 而不是http.post()，首先了解http 协议的工作原理，然后使用它们。
您的网址是否完整？你所展示的是“api/v1/getAllUsers”。您是否在网络选项卡中检查了呼叫的响应？
你确定List<User> list = userRepository.getAll(s); 有值canada 的数据吗？此外，data 上的forEach 不会在前端工作，因为它不是Array 类型，您需要在data.list 上迭代它。
是的，有加拿大价值的数据，我可以得到总数，但不能得到数据本身

标签： java angular spring rest

【解决方案1】：

这里的重点不是 HashMap 迭代，而是即使在这里你也得到空的响应数据。

 this.userService.getUsers("canada").subscribe((data) => {
       console.log(data);         // this returns an empty object

添加@ResponseBody

 @PostMapping(value = "getAllUsers")
 @ResponseBody
 public HashMap<String, Object> getAllUsers(@RequestBody String s)

现在开始迭代，一旦你得到不为空的响应，就有多种方法可以迭代 map。

  Object.keys(data).forEach(key => {

    console.log(key, data[key]);
  });

=> 最好使用 Http 约定使用 get 通过 post 获取数据。虽然在 Post 中仍然会收到数据，但更喜欢 get()。

【讨论】：

是的，正如你所说，问题出在控制器端，我得到的是空数据，但我得到了总数，谢谢

【解决方案2】：

您正在执行POST 请求，但在您的用例中，您应该使用GET http 方法来检索资源。 POST http 方法用于添加资源。您必须更改您的控制器才能使用@GetMapping()

@GetMapping("/getAllUsers")
public HashMap<String, Object> getAllUsers(@PathVariable String s)
{
    List<User> list = userRepository.getAll(s);

    HashMap<String, Object> userList = new HashMap<String, Object>();
    userList.put("list", list);
    userList.put("total", list.size());

    return userList;
}

您还应该将该控制器的参数从 @RequestBody 更改为 @PathVariable

@PathVariable注解用于接收绑定URI变量到方法参数。

@RequestBody注解绑定发送的内容（POST/PUT）带有注释变量的请求正文。（一般只能使用 @RequestBody 用于可以具有“正文”内容的请求，例如邮政或 PUT。）

您可以阅读 HTTP 方法 here。

【讨论】：

【解决方案3】：

Typescript 假设响应为 Object 类型的 any 而不是 Map，所以试试这个：

Object.entries(data).forEach((value: string, key: string) => { 
      console.log(key, value);
});

【讨论】：

我认为这不是问题。您仍然可以声明 any 并从 REST 端点获取数据。这里的问题是 REST 控制器没有返回任何内容。
但是你不能在any上应用forEach方法
并且没有不能从 POST 请求中检索数据的规则，将这些方法用于特定目的只是标准，但它们没有这样的限制