英文:
Map json object returned from springboot to map in typescript
问题
// hashmap returned from springboot to angular frontend
this.uploadservice.uploadtoserver(data).subscribe((res: any) => {
if (res.body != null) {
console.log(res.body);
for (var values in res.body) {
this.map.set(values, res.body[values]);
}
this.map.forEach((k, v) => console.log(k + " ------" + v));
}
})
// EXAMPLE json object
{
"temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip": "1600845901330278",
"temp/tempintemp/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip": "1600845901070176",
"temp/tempintemp/Queues-Queues-Challenge-Solution-Source-Code.zip": "1600845901182813",
"temp/tempintemp/Queues-Queues-(Array-Implementation)-Source-Code.zip": "1600845901611033"
}
// should be mapped as
key -------- value
temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip -------- 1600845901330278
temp/tempintemp/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip -------- 1600845901070176
temp/tempintemp/Queues-Queues-Challenge-Solution-Source-Code.zip -------- 1600845901182813
temp/tempintemp/Queues-Queues-(Array-Implementation)-Source-Code.zip -------- 1600845901611033
(Note: The provided content includes code snippets and JSON data, which are not translated as per your request. If you have specific questions about the translation or need assistance with any part, feel free to ask.)
英文:
hi i am trying to map a json object returned from spring boot to a map in typescript but no luck can anyone suggest a correct way of doing it i am attaching code snippet for better understanding and an example.
hashmap returned from springboot to angular frontend
@PostMapping("/uploadfile")
public ResponseEntity<HashMap<String, String>> handleupload(@ModelAttribute uploaddto dto){
System.out.println("sucessfull");
//System.out.println(dto.getFiletoupload().size());
//System.out.println(multifile.getOriginalFilename());
System.out.println(dto.getSelectedfile().size()+" "+dto.getInstancekey());
for(int i=0;i<dto.getSelectedfile().size();i++) {
System.out.println(dto.getSelectedfile().get(i).getOriginalFilename());
}
HashMap<String, String> hashmap=new HashMap<String, String>();
hashmap=(HashMap<String, String>) uploadtobucket(dto.getSelectedfile(),dto.instancekey);
//System.out.println(dto.getSelectedfile().get(0).getSize());
return ResponseEntity.status(HttpStatus.OK).body(hashmap);
}
trying to save it as a map in typescript
this.uploadservice.uploadtoserver(data).subscribe((res:any)=>{
if(res.body!=null){
console.log(res.body);
for(var values in res.body){
this.map.set(values,res.body[values])
}
this.map.forEach((k,v)=>console.log(k+" ------"+v));
}
})
EXAMPLE json object
{"temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip":"1600845901330278","temp/tempintemp/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip":"1600845901070176","temp/tempintemp/Queues-Queues-Challenge-Solution-Source-Code.zip":"1600845901182813","temp/tempintemp/Queues-Queues-(Array-Implementation)-Source-Code.zip":"1600845901611033"}
should be mapped as
key -------- value
temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip -------- 1600845901330278
temp/tempintemp/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip -------- 1600845901070176
temp/tempintemp/Queues-Queues-Challenge-Solution-Source-Code.zip -------- 1600845901182813
temp/tempintemp/Queues-Queues-(Array-Implementation)-Source-Code.zip -------- 1600845901611033
答案1
得分: 1
你可以使用Object.entries
函数,并将其传递给Map
构造函数。
const response = {
"temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip": "1600845901330278",
"temp/tempintemp/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip": "1600845901070176",
"temp/tempintemp/Queues-Queues-Challenge-Solution-Source-Code.zip": "1600845901182813",
"temp/tempintemp/Queues-Queues-(Array-Implementation)-Source-Code.zip": "1600845901611033"
}
const myMap = new Map(Object.entries(response));
console.log(myMap.get("temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip"))
// 输出 "1600845901330278"
英文:
You can use the Object.entries
function and pass it to the Map
constructor.
const response = {
{"temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip":"1600845901330278","temp/tempintemp/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip":"1600845901070176","temp/tempintemp/Queues-Queues-Challenge-Solution-Source-Code.zip":"1600845901182813","temp/tempintemp/Queues-Queues-(Array-Implementation)-Source-Code.zip":"1600845901611033"}
}
const myMap = new Map(Object.entries(response));
console.log(myMap.get("temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip"))
// Outputs "1600845901330278"
答案2
得分: 1
期望从后端获得一个转义的 Json 字符串,为了使代码更清晰易读,首先从 Json 创建一个对象,因为 Javascript/Typescript 原生支持 Json。
const rawData = "{\"temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip\":\"1600845901330278\",\"temp/tempintemp/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip\":\"1600845901070176\",\"temp/tempintemp/Queues-Queues-Challenge-Solution-Source-Code.zip\":\"1600845901182813\",\"temp/tempintemp/Queues-Queues-(Array-Implementation)-Source-Code.zip\":\"1600845901611033\"}";
const parsedData = JSON.parse(rawData);
const dataMap = new Map(Object.entries(parsedData));
console.log(dataMap.get("temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip"));
// 输出:"1600845901330278"
从这里,您可以使用 Object.entries() 方法,该方法在所有现代浏览器(不包括 IE)中都受支持,它返回一个键值对数组的数组 [[key1, value1], [key2, value2], ...]。这个数组可以传递给 Map() 构造函数。这些都是简单的 ES6 特性,而不是 Typescript。但当然,这也是有效的 Typescript 代码。
英文:
expecting you get an escaped Json-String back from your backend it's cleaner and more readable to first make an object from Json because Javascript/Typescript has native Json support.
const rawData = "{\"temp\/tempintemp\/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip\":\"1600845901330278\",\"temp\/tempintemp\/Sort-Algorithms-Sort-Algorithms-Challenge-#3-Source-Code.zip\":\"1600845901070176\",\"temp\/tempintemp\/Queues-Queues-Challenge-Solution-Source-Code.zip\":\"1600845901182813\",\"temp\/tempintemp\/Queues-Queues-(Array-Implementation)-Source-Code.zip\":\"1600845901611033\"}";
const parsedData = JSON.parse(rawData);
const dataMap = new Map(Object.entries(parsedData));
console.log(dataMap.get("temp/tempintemp/Queues-Circular-Queue-Implementation-(Part-Two)-Source-Code.zip"));
>>"1600845901330278"
From there you can use Object.entries() method which is supported in all modern browers (not IE) which returns an array of kvp arrays [[key1, value1], [key2, value2], ...]. This array can be passed to the Map() constructor. These are all simple ES6 features not Typescript. But its of course valid Typescript code.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论