Thymeleaf-单击锚标记时,在div中显示模型对象

时间:2017-12-10 12:47:01

标签: spring spring-boot thymeleaf

在我的控制器中,我返回一个这样的模型对象:

double[] calculateYearMonth=statistics.CalculateActive();
modelAndView.addObject("statistics",calculateYearMonth);

此calculateActive方法返回一个包含4个成员的数组。 女性,男性,年份,月份,比率。

在我的Html中,我有一个div,在它下面我有两个链接:

<div class="row centerAlign">
    <h1><strong>RESULTS</strong></h1>
</div>

<div class="row centerAlign" id="month">
    <div>
        <a href="" style="float: right;">Month</a>
        <a href="" style="float: left;">Year</a>
    </div>
</div>

当我点击表示月份的锚点时,我想得到对象统计数据[3] - 所以第三个成员并显示它所说的结果。 当我点击年份时,我想得到统计数据但是第4位成员。并将其显示在结果上。

如何使用Thyemeleaf做到这一点?如何将所选锚点与要显示的锚点链接? 感谢

1 个答案:

答案 0 :(得分:0)

您可以使用以下内容将数据存储在javascript对象中:

<script th:inline="javascript">
    var stats = /*[[${statistics}]]*/{};
</script>

然后这个javascript对象stats在客户端可用,您可以根据点击的锚点获取所需的数据

<a href="javascript:void(0);" style="float: right;" 
   class="results" data-index="3">Month</a>
<a href="javascript:void(0);"style="float: right;" 
   class="results" data-index="4">Year</a>

在事件处理程序中,您可以写:

$(".results").on('click', function(){
  var index = $(this).data("index");
  var statObj = stats[index];
});