Google Apps Scriptの出力スクリプトレットタグでリストを取得したい

前提・実現したいこと

Google Apps Scriptのgsファイルの関数を、
HTMLからリスト型で呼び出したい。

発生している問題・エラーメッセージ

list = ['リンゴ', 'イチゴ', 'スイカ'];
上記listを取得すると、

＞＞リンゴ,イチゴ,スイカ
という文字列になってしまい、

list[0]とすると、
＞＞　リ
となってしまう。

これを、
＞＞リンゴ
と表示させたい。

該当のソースコード

gs
1function main() {
2  var html = HtmlService.createTemplateFromFile("dialog").evaluate();
3  SpreadsheetApp.getUi().showModalDialog(html, "選択してください");
4};
5
6function getData() {
7  var hoge = ['リンゴ', 'イチゴ', 'スイカ'];
8  return hoge;
9};

html
1<!DOCTYPE html>
2<html>
3    <head>
4        <base target="_top">
5        <script type='text/javascript'>
6            function htmlA() {
7                var lista = <?= getData(); ?>;
8                alert(lista[0]);
9            }
10        </script>
11    </head>
12    <body>
13        <a href="#" onclick="htmlA()">テスト</a>
14    </body>
15</html>

試したこと

var lista = <?= getData(); ?>;
alert(lista[0]);

上記で、listaに、getData関数の返り値を代入していますが、
list型にならないため、lista[0]で、「リ」と出力されます。

標準スクリプトレットタグ（<? ?>）だと、
gs内に書いてあることを直接htmlの中に書けば、一応は実現できますが、
可読性や、メンテナンス性が落ちるので、

できることであれば、
出力スクリプトレットタグ（<?= ?>）で実現したいと考えています。

補足情報（FW/ツールのバージョンなど）

Google Spread Sheet
Google Apps Script
(Chrome V8は無効）

行動規範の内容に同意します

回答1件

ベストアンサー

HTMLテンプレートでスクリプトレットを使って値がHTMLへ挿入されると文字列に変換されます。これが問題の原因と思われます。そこで今の場合、一つの解決策として、次のような変更はいかがでしょうか。

From

javascript
1var lista = <?= getData(); ?>;

この場合、文字列として'リンゴ','イチゴ','スイカ'がlistaへ代入されます。

To

javascript
1var lista = (<?= getData(); ?>).split(",");

solit()を使って文字列の'リンゴ','イチゴ','スイカ'を配列に分離しています。

他の方法

他の方法として、getData()のreturn hoge;をreturn JSON.stringify(hoge);に変更し、var lista = <?= getData(); ?>;をvar lista = JSON.parse(<?= getData(); ?>);に変更することでも配列として使用することが可能です。

投稿2020/02/27 05:59