如何将变量从 PlayFramework 1.2.4 传递到 Javascript答案

【问题标题】：How to pass a variable from PlayFramework 1.2.4 to Javascript如何将变量从 PlayFramework 1.2.4 传递到 Javascript
【发布时间】：2014-02-01 15:56:35
【问题描述】：

我发现这个关于 GMAP V3 的很好的教程使用 json http://www.svennerberg.com/2012/03/adding-multiple-markers-to-google-maps-from-json/ javascript 很好，它对我有用。

现在，我想从 Play 控制器获取 JSON；

这里是控制器：

public static void handleSubmit2(Bill bill)
    {

Gson gson; 


        Location l = new Location((long) 1,"u222","fes","morococ","37.401220","-12.125604","8 25 98");
        Location l2 = new Location((long) 1,"u222","fes","morococ","34.401220","-122.125604","8 25 98");
        Location l3 = new Location((long) 1,"u222","fes","morococ","40.401220","-50.125604","8 25 98");

        List<Location> locs = new ArrayList<Location>();;
        locs.add(l);
        locs.add(l2);
        locs.add(l3);

        List<JsonValid> jsons = new ArrayList<JsonValid>();
        JsonValid jsonV = new JsonValid();

        for(int i = 0 ; i<locs.size();i++)
        {
            jsonV.title = locs.get(i).city;
            jsonV.lat = locs.get(i).latitude;
            jsonV.lng = locs.get(i).longitude;

            jsons.add(i, jsonV);

        }

        gson = new Gson();
        String jlocations = gson.toJson(jsons);

        //The format is valid when I see the output
        System.out.println("json = " + jlocations);

        render("@handleSubmit2",jlocations);
    }

这里是视图handleSubmit2.html

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map_canvas { height: 100% }
    </style>
    <script type="text/javascript"
      src="http://maps.googleapis.com/maps/api/js?key=KEY&sensor=true">
    </script>
    <script type="text/javascript">
    (function() {

        window.onload = function() {

            // Creating a new map
            var map = new google.maps.Map(document.getElementById("map"), {
              center: new google.maps.LatLng(57.9, 14.6),
              zoom: 6,
              mapTypeId: google.maps.MapTypeId.ROADMAP
            });


            // Creating the JSON data
            var json = ${jlocations};

            // Creating a global infoWindow object that will be reused by all markers
            var infoWindow = new google.maps.InfoWindow();

            // Looping through the JSON data
            for (var i = 0, length = json.length; i < length; i++) {
                var data = json[i],
                    latLng = new google.maps.LatLng(parseFloat(data.lat), parseFloat(data.lng));

                // Creating a marker and putting it on the map
                var marker = new google.maps.Marker({
                    position: latLng,
                    map: map,
                    title: data.title
                });

                // Creating a closure to retain the correct data, notice how I pass the current data in the loop into the closure (marker, data)
                (function(marker, data) {

                    // Attaching a click event to the current marker
                    google.maps.event.addListener(marker, "click", function(e) {
                        infoWindow.setContent(data.description);
                        infoWindow.open(map, marker);
                    });


                })(marker, data);

            }

        }

    })();
    </script>


  </head>
  <body>
  <h1>Map for bill</h1>
    <div id="map" style="width:800px; height:500px"></div>

  </body>
</html>

我应该在我的 javascript 中添加什么以便它可以获取 JSON ？

任何建议，任何可以帮助的链接。

P.S : 我的 Javascript 很糟糕，而且是 Play 的初学者，所以请多多包涵。

最好的问候，感谢您帮助我。

【问题讨论】：

控制器在那里所做的是将变量 jlocations 传递给带有 @handleSubmit2 名称的“模板处理”阶段，以便模板引擎对其进行处理，因此取决于您使用的模板引擎以及如何使用您渲染它，然后我们可以帮助您如何从 javascript 访问它。所以你需要用视图代码更新帖子
感谢您的回答。我已经用 handleSubmit2.html 的视图更新了帖子
见this和this你需要在render()之前调用renderArgs.put('jlocations', jlocations)
感谢您的帮助。我添加了 renderArgs 但它总是不显示地图。
一步一步来，首先你可以从一个简单的console.log("data:" + json);在您的视图上分配 json var 并在控制台中查看输出后

标签： javascript playframework-1.x

【解决方案1】：

所以继续：

1) 为了将参数传递给视图：在 render() 之前调用 renderArgs.put("jlocations", jlocations)

2) 为了正确呈现 json 引号：在视图代码中您需要分配 var json = ${jlocations.raw()}

提示：使用浏览器的控制台

【讨论】：

再次感谢您！对于 renderArgs 请编辑：我们使用双引号而不是简单的双引号