JADE + EXPRESS: перебор объекта во встроенном JS-коде (на стороне клиента)?

Question

Я хочу реализовать карту Google на основе ее API. я хочу добавить путь на основе координат к нему. поэтому я получаю свои координаты из моей модели и хочу перебрать объект, чтобы заполнить карту этими точками. В моем нефритовом шаблоне я включил код API ji, как это:

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;')

проблема в том, что jade отображает этот фрагмент

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)
      ];

как в исходном коде нефритового шаблона ... - если и т. Д. Не анализируется! есть идеи?

спасибо!

Answer 1

Весь тег сценария (все с отступом под ним) будет проходить через raw без дальнейшего анализа.Jade создает шаблоны HTML, а не шаблоны HTML, а также вложенные шаблоны Javascript.Чтобы передать вашу переменную pins из данных переменной локального шаблона jade в исходный код сценария, вам придется использовать другой подход, например, использовать raw jade для рендеринга крошечного тега сценария, который просто вызывает вашу функцию initialize с помощью pinsданные как литерал, или вставьте ваши pins данные в DOM-файл, а затем прочитайте их оттуда.Что-то вроде этих строк под тегом скрипта (псевдокод, не проверял)

- 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>"

Answer 2

Я передал значение как скрытый элемент ввода, например ::1001

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

Доступ через jQuery:

    $("#variableName").val()

Джо

Answer 3

Вы можете использовать это:

script
  console.log(#{var_name});

Answer 4

теги сценария являются чисто текстовыми, вы не можете легко смешать Jade для создания этого javascript, обычно это отражение плохого дизайна.Вы можете просто сериализовать вещи как JSON, которые вам нужны на клиенте, или использовать express-expose для этого

Answer 5

на стороне сервера

JSON.stringify(users)

на стороне клиента

var users=JSON.parse(("#{users}").replace(/"/g,'"'));

Answer 6

У меня была похожая проблема, и эта строка кода решила ее:

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

Ответ исходил от этого поста