Question

我有一个我希望传递给模板化HTML文件的对象。如果我使用一个简单的变量，一切都很好，因为这些工作：在服务器端，我在code.gs的顶部有以下内容：

//Define this here globally so it is accessed in the HTML Template
    var passedFestival = ' ';
    var passedSID = ' ';
    var passedRID = 'FALSE';

我在HTML文件中

：

<script>

  var passedFestival = '<?!= passedFestival ?>';
  var passedSID = '<?!= passedSID ?>';
  var passedRID = '<?!= passedRID ?>';

</script>

我可以在以后的代码中使用它们并获得适当的值。我还想使用一个Object，它是从电子表格中读取几行的结果，并且基本上导致以下任何函数外部，与上面的其他变量相同：

var testformOptions = [];
testformOptions['currencies'] = [{"currency":"CAD", "default":false, "defaultOption":"Interac", "paymentOptions":"Cheque|Credit Card|Interac|PayPal", "sheetrow":2}, {"currency":"USD", "default":true, "defaultOption":"PopMoney", "paymentOptions":"Cheque|Credit Card|PayPal|PopMoney", "sheetrow":3}];
testformOptions['meals'] = {"use":true, "required":false, "default":"Omnivore", "values":"Omnivore|Vegan"};

在HTML文件中我可以引用对象的各个值：

if ('<?!= testformOptions.currencyOptions.use ?>') {
  $("#currencies").show();
}

但我宁愿完全复制对象并将其作为客户端数据的一部分引用。我尝试了一些事情，其中大部分都是我理解为什么它们不起作用，但我认为这会：

var formOptions = jQuery.extend(true, {}, <?!= testformOptions?>;

我尝试将数据保存为变量json，但由于我的最终对象中有单引号和其他特殊字符，因此无效。

有没有办法在加载后使用google.script.run将对象传递到客户端外部的对象以传递它？我正在阅读电子表格数据作为初始doGet的一部分，所以我认为使用模板化HTML并传递对象可能会更快。

修改

感谢回复，我有工作代码。最终样本如下。遗漏了一些项目以允许关注重要部分。 Code.gs：

var passedSID = ' ';
var passedRID = 'FALSE';
function doGet(passed) {

  if(passed.parameter.rid && passed.parameter.msid){
    // A registration ID and Spreadsheet ID were passed so this is to edit an existing registration
    passedSID = passed.parameter.msid;
    passedRID = passed.parameter.rid;
    var registrationValues = getRegistrationValues(passedSID, passedRID);
  }
  else if(passed.parameter.msid){
    // A Spreadsheet ID was passed so this is to complete a new registration
    passedSID = passed.parameter.msid;
  }

  //get the form options from the appropriate spreadsheet file
  //getFormOptions() is from Tutorial: Simple Mail Merge
  //https://developers.google.com/apps-script/articles/mail_merge
  testformOptions = getFormOptions(passedSID);

  //Create the HTML template
  var template = HtmlService.createTemplateFromFile('Index');

  template.data = JSON.stringify(testformOptions);

  // Build and return HTML in IFRAME sandbox mode.
  return template.evaluate()
      .setTitle('Registration Form').setWidth(620).setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}

function include(filename) {
  return HtmlService.createTemplateFromFile(filename).evaluate()
      .getContent();
}

的index.html：

<?!= HtmlService.createHtmlOutputFromFile('Stylesheet').getContent(); ?>
<link href="https://fonts.googleapis.com/css?family=Raleway:100" rel="stylesheet">
<html>
  <body>
  <div id="mybody">
  <form>
   <!-- Boring form html -->
</form>
</div>
  </body>
</html>

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
    var formOptions = $.extend(true, {}, <?!= data ?>);
</script>

<!-- Use a templated HTML printing scriptlet to import JavaScript. -->
<?!= HtmlService.createHtmlOutputFromFile('jquery_cloneform_js').getContent(); ?>
<?!= include('JavaScript'); ?>

在JavaScript.html中：

<script>
  var passedSID = '<?!= passedSID ?>';
  var passedRID = '<?!= passedRID ?>';

  // use onload to call initialization after the document loads
  window.onload = setForm;
function setForm(){

  var optionArray = [];
  var defaultOption = '';

  if (formOptions.currencyOptions.use) {
    $("#currencies").show();
    //Set the options for the currency
    var options = formOptions.currencyOptions.values;
    defaultOption = formOptions.currencyOptions.defaultOption;
    optionArray =  options.split("|");
    setSelectOptions('regcurrency', optionArray, defaultOption);

    var options = formOptions.currencies[1].paymentOptions;
    defaultOption = formOptions.currencies[1].defaultOption;
    optionArray =  options.split("|");
    setSelectOptions('paymentMethod', optionArray, defaultOption);
  }
}

Answer 1

以下答案怎么样？

修改要点：

OldestInstance

关于上述脚本，var testformOptions = []; testformOptions['currencies'] = [{"currency":"CAD", "default":false, "defaultOption":"Interac", "paymentOptions":"Cheque|Credit Card|Interac|PayPal", "sheetrow":2}, {"currency":"USD", "default":true, "defaultOption":"PopMoney", "paymentOptions":"Cheque|Credit Card|PayPal|PopMoney", "sheetrow":3}]; testformOptions['meals'] = {"use":true, "required":false, "default":"Omnivore", "values":"Omnivore|Vegan"};被定义为数组。因此无法导入testformOptions和testformOptions['currencies']。因此，请从testformOptions['meals']修改为var testformOptions = [];。
当它通过对象时，请使用var testformOptions = {};。

以上修改反映的脚本如下。

code.gs：

JSON.stringify()

的index.html

function doGet() {
  var testformOptions = {};
  testformOptions['currencies'] = [{"currency":"CAD", "default":false, "defaultOption":"Interac", "paymentOptions":"Cheque|Credit Card|Interac|PayPal", "sheetrow":2}, {"currency":"USD", "default":true, "defaultOption":"PopMoney", "paymentOptions":"Cheque|Credit Card|PayPal|PopMoney", "sheetrow":3}];
  testformOptions['meals'] = {"use":true, "required":false, "default":"Omnivore", "values":"Omnivore|Vegan"};

  var t = HtmlService.createTemplateFromFile('index');
  t.data = JSON.stringify(testformOptions);
  return t.evaluate();
}

结果：

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<p id="disp"></p>
<script>
    var data = $.extend(true, {}, <?!= data ?>);
    $('#disp').text(JSON.stringify(data));
</script>

如果我误解了你的问题，我很抱歉。

将对象传递给模板化HTML

1 个答案:

修改要点：

code.gs：

的index.html

结果：