Шаблон HTML создает веб-страницу, но вставляет пробел между каждой выводимой буквой (числом и т. Д.) - PullRequest
0 голосов
/ 26 апреля 2019

Я работаю над версией шаблонного HTML, как объяснено на https://developers.google.com/apps-script/guides/html/templates. Мой код возвращает меня к правильно отформатированной веб-странице, но для одной маленькой проблемы: код застревает в пробеле между каждым предметом. Таким образом, я получаю «я не», а не «предмет». (Снимок экрана с фактическим выводом приведен ниже.)

Я подозреваю, что виновник находится в html-файле, который также перепечатывается ниже.

Screenshot

Я исследовал шаблонные html и "пробелы", "вставленные пробелы" и т. Д. И не могу найти никого другого, кто имел эту проблему.

Минимальный завершенный проверяемый пример:

Index.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
<table>
    <ul type="square">
      <? for (var i = 0; i < data.length; i++) { ?>
          <li><? for (var j = 0; j < data[i].length; j++) { ?>
            <?= data[i][j] ?>
          <? } ?></li><br>
      <? } ?>
    </ul>
    </table>
  </body>
</html>

data происходит от

Code.gs

function doGet(){
    var instrument = "Martin D-18 (↓1/2)"; 
    var tuning = "Drop D";
    var key ="Db";
    var t = HtmlService.createTemplateFromFile('Index');
    t.data = [instrument, tuning, key];
    return t.evaluate();
}

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

Обновление -

re monofont не выдается. Вот журнал из скрипта, показывающий основные переменные, которые анализирует HTML. Как видите, неуместных мест нет.

[19-04-26 13:27:24:743 EDT] instrument = Martin D-18 (↓1/2)
[19-04-26 13:27:24:743 EDT] tuning = Drop D
[19-04-26 13:27:24:744 EDT] settings = 
[19-04-26 13:27:24:744 EDT] key = Db
[19-04-26 13:27:24:745 EDT] chord = D

Ответы [ 2 ]

1 голос
/ 26 апреля 2019

Проблема:

data - одномерный массив.Вы повторяете это дважды вложенным способом.

Если data[i] (для i = 0) является строкой,

data[0] "Martin D-18 (↓1/2)"

data[i][j] будет строкой:

data[0][0] M
data[0][1] a
data[0][2] r
data[0][3] t
data[0][4] i
data[0][5] n
data[0][6]
data[0][7] D
data[0][8] -
data[0][9] 1
data[0][10] 8
data[0][11]
data[0][12] (
data[0][13] ↓
data[0][14] 1
data[0][15] /
data[0][16] 2
data[0][17] )

, поскольку строки являются итеративными простокак массивы.

Решение:

Цикл один раз для элемента в массиве data.

Фрагмент:

<? for (var i = 0; i < data.length; i++) { ?>
  <li><?= data[i] ?></li><br>
<? } ?>
1 голос
/ 26 апреля 2019

Важно избегать добавления лишних пробелов в HTML.

ВнутриВы можете добавить столько пробелов, сколько захотите, но пробелы вне его являются пробелами в HTML и будут отображаться браузером.

Этот код удаляет такие лишние пробелы.

  <? for (var i = 0; i < data.length; i++) { ?>
      <li><? for (var j = 0; j < data[i].length; j++) { 
        ?><?= data[i][j] ?><?
       } ?></li><br>

  <? } ?>

Но этот ответ лучше.Проблема была не только в пробелах в HTML, но и в итерации по строке.

...