1

我有一些在 Hamlet 中使用的 HTML 代码：

 <div .modal-card .card data-options='{"valueNames": ["name"]}' data-toggle="lists">

请注意，单引号 fordata-options允许在字符串中使用双引号。

问题是当哈姆雷特呈现页面时，哈姆雷特放置"了'，所以 HTML 被破坏了：

<div class="modal-card card" data-options="'{" valuenames":"="" ["name"]}'="" data-toggle="lists">

一些外部 JS 库插件代码运行，它尝试解析内部的 JSONdata-options并失败。

如何告诉 Hamlet 包含文字字符串？

我尝试了以下各种组合：

let theString = "{\"valueNames\": [\"name\"]}"
let theString2 = "data-options='{\"valueNames\": [\"name\"]}'"
etc

在 hamlet 文件中：

 <div .modal-card .card data-options='#{ preEscapedText theString }' data-toggle="lists">
or
 <div .modal-card .card #{ preEscapedText theString2 } data-toggle="lists">

但是所有尝试都会在字符串中产生无效的 HTML 或无效的 JSON。

如何指示 Hamlet 在输出 HTML 中简单地包含文字字符串？

更新：

尝试了更多的东西，没有结果。

该string2示例不起作用，因为哈姆雷特似乎认为我正在尝试id="{"按照https://www.yesodweb.com/book/shakespearean-templates#shakespearean-templates_attributes进行设置

4

1 回答 1

2

为什么不渲染 JSON 转义 ( "become &quot;) 并在解析时“处理”引号？

在哈姆雷特中插值：

<div #the-modal .modal-card .card data-options='#{theString}' data-toggle="lists">

将数据属性解析为 JSON：

let json = document.getElementById("the-modal").getAttribute("data-options");
let opts = JSON.parse(json); // At least in Chrome, it works!

至于theString2替代方案，您还可以使用元组或元组列表和星号在 Hamlet 中插入属性：

let dataOptions = ("data-options", "{\"valueNames\": [\"name\"]}") :: (Text, Text)
...
<div #the-modal .modal-card .card *{dataOptions} data-toggle="lists">
于 2019-10-29T04:44:47.697 回答