英文:
Iterate a HashMap with nested HashMap values in javascript by using thymeleaf
问题
这是添加到模型中的对象：
HashMap<String,HashMap<String,Integer>> eventByMonthAndYear;
我尝试的迭代方式
我尝试了以下方法，但目前都没有成功。
我的努力
<script type="text/javascript" th:inline="javascript">
/*<![CDATA[*/
/*[# th:each="entry: ${eventByMonthAndYear}"]*/
console.log(/*[[${entry}]]*/);
/*[/]*/
/*]]>*/
</script>
没有输出任何对象，请问如何至少检索第一个 HashMap？
英文:
This is the object added to the model:
HashMap<String,HashMap<String,Integer>> eventByMonthAndYear;
How I tried to iterate it
I've tried these solutions but none has worked so far for me.
Iterate HashMap using thymeleaf
My efford
<script type="text/javascript" th:inline="javascript">
/*<![CDATA[*/
/*[# th:each="entry: ${eventByMonthAndYear}"]*/
console.log(/*[[${entry}]]*/);
/*[/]*/
/*]]>*/
</script>
No object is printed, how can i at-least retrieve the first HashMap?
答案1
得分: 1
假设我们有以下的测试数据：
Map<String, Integer> intMapA = new HashMap();
intMapA.put("one", 1);
intMapA.put("two", 2);
intMapA.put("three", 3);
Map<String, Integer> intMapB = new HashMap();
intMapB.put("four", 4);
intMapB.put("five", 5);
intMapB.put("six", 6);
Map<String, Map<String, Integer>> eventByMonthAndYear = new HashMap();
eventByMonthAndYear.put("Event A", intMapA);
eventByMonthAndYear.put("Event B", intMapB);
Map<String, Object> model = new HashMap();
model.put("events", eventByMonthAndYear);
这些内容会传递到 Thymeleaf 模板中。
我们可以在 JavaScript 中如下访问 events 对象：
<script th:inline="javascript">
var events = [[${events}]];
console.log(events);
</script>
你可以按照通常的 JS 方式来迭代这个变量。
更有用的是在 HTML 中访问对象，并且使用 Thymeleaf 迭代嵌套的映射：
<body>
<div th:each="event : ${events}">
<div th:text="${event.key}">
</div>
<div th:each="eventItem : ${event.value}">
<div th:text="${' -> ' + eventItem.key} + ' - ' + ${eventItem.value}"></div>
</div>
</div>
</body>
最后这个例子会在浏览器中显示如下内容：
Event B
-> six - 6
-> four - 4
-> five - 5
Event A
-> one - 1
-> two - 2
-> three - 3
显然，由于我们特定使用了哈希映射，检索的顺序不能保证与插入的顺序相同。
英文:
Assume we have the following test data:
Map<String, Integer> intMapA = new HashMap();
intMapA.put("one", 1);
intMapA.put("two", 2);
intMapA.put("three", 3);
Map<String, Integer> intMapB = new HashMap();
intMapB.put("four", 4);
intMapB.put("five", 5);
intMapB.put("six", 6);
Map<String, Map<String, Integer>> eventByMonthAndYear = new HashMap();
eventByMonthAndYear.put("Event A", intMapA);
eventByMonthAndYear.put("Event B", intMapB);
Map<String, Object> model = new HashMap();
model.put("events", eventByMonthAndYear);
This is what gets passed to the Thymeleaf template.
We can access the events object in Javascript as follows:
<script th:inline="javascript">
var events = [[${events}]];
console.log(events);
</script>
You can iterate the variable in the usual JS way.
What may be of more use is to access the object in the HTML and iterate over the nested maps using Thymeleaf:
<body>
<div th:each="event : ${events}">
<div th:text="${event.key}">
</div>
<div th:each="eventItem : ${event.value}">
<div th:text="${' -> ' + eventItem.key} + ' - ' + ${eventItem.value}"></div>
</div>
</div>
</body>
This last example displays the following in the browser:
Event B
-> six - 6
-> four - 4
-> five - 5
Event A
-> one - 1
-> two - 2
-> three - 3
Obviously, because of our specific use of hashmaps, the order of retrieval is not guaranteed to be the same as the insertion order.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论