11

私はそのAPIに基づいてグーグルマップを実装したいと思います。座標に基づいたパスを追加したい。したがって、モデルから座標を取得し、オブジェクトを反復処理して、このポイントでマップを塗りつぶしたいと思います。私のヒスイのテンプレートには、次のようなapijsコードが含まれています。

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 = [

       - if (typeof(pins) != null)
           - var.pins.forEach(function(pin) {
                new google.maps.LatLng(pin.latitude, pin.longitude),
           - })
           new google.maps.LatLng(0,0)
      ];
      var flightPath = new google.maps.Polyline({
        path: flightPlanCoordinates,
        strokeColor: "#FF0000",
        strokeOpacity: 1.0,
        strokeWeight: 2
      });

      flightPath.setMap(map);
    }

div#map_canvas(style='height: 500px; background-color: #990000;')

問題は次のとおりです。ヒスイはこのスニペットをレンダリングします

var flightPlanCoordinates = [

       - if (typeof(pins) != null)
           - var.pins.forEach(function(pin) {
                new google.maps.LatLng(pin.latitude, pin.longitude),
           - })
           new google.maps.LatLng(0,0)
      ];

翡翠テンプレートソースにあるので...--ifなどは解析されません！何か案は？

ありがとう！

4

6 に答える 6

16

スクリプトタグ全体（その下にインデントされているものすべて）は、さらに解析せずにrawを通過します。Jadeは、HTMLテンプレートではなくHTMLテンプレートと、ネストされたjavascriptテンプレートを実行します。pins変数をjadeローカルテンプレート変数データからスクリプトソースコードに渡すには、生のjadeを使用して、データをリテラルとして関数を呼び出すだけの小さなスクリプトタグをレンダリングする、またはデータを貼り付けるなど、他のアプローチを実行する必要がありinitializeます。どこかのドームに入れて、そこから読んでください。スクリプトタグの下にあるこれらの行に沿ったもの（擬似コード、テストされていません）pinspins

- if (typeof(pins) != null)
  != "<script type='text/javascript'>"
  != "var pins = [];"
  - forEach pin in pins
    != "pins.push(new Pin(" + pin.latitude + ", " + pin.longitude + "));"
  != "initialize(pins);"
  != "</script>"
于 2011-06-08T05:11:42.543 に答える
5

値を非表示の入力要素として渡しました。例：

    input(type='hidden', id='variableName', value='#{variableName}')

jQuery経由でアクセス：

    $("#variableName").val()

ジョー

于 2011-08-08T17:11:44.603 に答える
3

あなたはこれを使うことができます： 

script
  console.log(#{var_name});
于 2012-04-19T16:42:08.270 に答える
2

スクリプトタグは純粋なテキストであり、Jadeを簡単に組み合わせてこのJavaScriptを生成することはできません。これは通常、デザインが不十分であることを反映しています。クライアントで必要なものをJSONとしてシリアル化するか、express-exposeを使用してこれを行うことができます

于 2012-01-03T18:42:50.727 に答える
1

サーバ側

JSON.stringify(users)

クライアント側

var users=JSON.parse(("#{users}").replace(/&quot;/g,'"'));
于 2014-06-10T12:13:05.517 に答える
0

同様の問題があり、このコード行で解決しました。

var myvar  = !{JSON.stringify(mydata)};

答えはもともとこの投稿から来ました

于 2016-11-23T05:23:15.627 に答える