Question

我正在尝试将数据从spring控制器传递给javascript，但没有运气。我应该使用ajax来做到这一点吗？请问你能给我一些关于这个怎么做的提示？什么是最好的方式？

在我的控制器中，我尝试传递数据：

@RequestMapping(value = "/map", method = RequestMethod.GET)
public String map(ModelMap model) {

...

model.addAttribute("trackpoints", json);


return "map";

}

其中json是一个包含：

的gson对象（JsonObject）

{"trackpoints":[{"latitude":52.390556,"longitude":16.920295},
{"latitude":52.390606,"longitude":16.920262}]}

在我的jsp文件中我有：

<script type="text/javascript">

var myJSON = {};

myJSON = ${trackpoints};

document.writeln(myJSON.trackpoints);

</script>

但结果是：

[object Object],[object Object]

我更详细地解释了这一点：＆gt;

我想使用谷歌地图api显示地图和绘制路径协调从许多lat，longs。我认为json会比list更好，但我可能错了。

我尝试从文档调整代码 - 在下面的代码中，我尝试用循环替换硬编码坐标，并从json对象替换值。

<script type="text/javascript">
function initialize() {
    var myLatLng = new google.maps.LatLng(0, -180);
    var myOptions = {
        zoom : 3,
        center : myLatLng,
        mapTypeId : google.maps.MapTypeId.TERRAIN
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"),
            myOptions);
    var flightPlanCoordinates = [
            new google.maps.LatLng(37.772323, -122.214897),
            new google.maps.LatLng(21.291982, -157.821856),
            new google.maps.LatLng(-18.142599, 178.431),
            new google.maps.LatLng(-27.46758, 153.027892) ];
    var flightPath = new google.maps.Polyline({
        path : flightPlanCoordinates,
        strokeColor : "#FF0000",
        strokeOpacity : 1.0,
        strokeWeight : 2
    });

    flightPath.setMap(map);
}
</script>

我希望现在更清楚了:)）

Answer 1

myJSON.trackpoints是一个包含两个对象的数组。如果你想把它写成HTML，你可以这样做：

function writeCoordinates(coords) {
    document.writeln('<div>lat = ' + coords.latitude);
    document.writeln(', lon = ' + coords.longitude + '</div>');
}

int len = myJSON.trackpoints.length;
for (int i = 0; i < len; i++) {
    writeCoordinates(myJSON.trackpoints[i]);
}

BTW：当您使用AJAX请求时，JSON非常有用，但对于“普通”请求，最好将普通Java对象放入模型中，例如：

Spring Controller：

List<Coordinate> trackpoints = ...
model.addAttribute("trackpoints", trackpoints);

<强> JSP ：

<c:forEach items="${trackpoints}" var="coord">
    <div>lat = ${coord.latitude}, lon = ${coord.longitude}</div>
</c:forEach>

给出，Coordinate类包含方法getLatitude()和getLongitude()。 Spring控制器中的该方法甚至可以用于“普通”和AJAX请求，方法是使用JSON编码器，如Jackson和ContentNegotiatingViewResolver。

Answer 2

看看：http://jsfiddle.net/AHue8/4/

我想这里的内容是你需要指定你想要的trackpoint对象中的哪个元素，然后你可以控制它们在浏览器中的显示方式。由于“trackPoint”不是原始数据类型（它是具有2个数据元素纬度和经度的对象），因此浏览器不知道如何解释它，因此您必须告诉它如何。

Answer 3

我有同样的需求：将 Java 对象列表从 Spring 启动控制器传递到 Javascript 代码（作为 Json 对象处理），我找到了一个解决方案：

在 Java 中

获取MyObject的列表，将其转换为等效的文本Json表示并将其附加到模型中，结果如下所示：

import com.google.gson.Gson;

@Service
public class MyService {

    private static final Gson GSON = new Gson();
    
    
    public void getData(final Model model) {
        List<MyObject> myObjectList = getObjects...
        model.addAttribute("myObjectListAsJsonText", GSON.toJson(myObjectList));
    }
    
}

在 JSP/HTML 页面中（不在单独的 JS 文件中）

添加一个脚本块，获取MyObject列表的Json表示，并转换为可以被Javascript处理的Json数组：

<title>MyApp | Main page</title>
<link rel="shortcut icon" href="resources/img/favicon.ico">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script  th:inline="javascript">
    var myObjectListAsJson = '${myObjectListAsJsonText}';
    var myObjectJsonArray = JSON.parse(myObjectListAsJson);
</script>

在同一页面的任何分离的Javascipt文件中

可以访问全局变量 myObjectJsonArray，该变量保存 MyObject 项目的 Json 数组，例如：

function processMyObjectJsonArray() {
    for (var index = 0; index < myObjectJsonArray.length; index++) {
        var myObjectJsonItem = myObjectJsonArray[index];
        console.log("Can access ID attribute of an item of MyObject array:" + myObjectJsonItem.id);
    }
}

如何将json对象从java传递给javascript？

3 个答案: