在 XSL 模板中包含带冒号的 JS 语法

Question

我正在尝试使用 Photo Sphere Viewer JS library 为嵌入的 360 度照片创建一个 XSL 模板（由 Saxon 处理器使用）。我运行遇到一个问题，其中部分基本嵌入代码在模板中导致致命错误：

我的示例 XSL 的相关部分：

<xsl:template name="myPanoramaTemplate">
<xsl:variable name="image" select="div/[@data-name='PanoImage']/img/@src"/>

<div id="viewer" style="width: 100vw; height: 100vh;"></div>
<script>
  var viewer = new PhotoSphereViewer.Viewer({
    container: document.querySelector('#viewer'),
    panorama: '{$image}'
  });
</script>
<xsl:template>

这一直导致以下情况：

Fatal Error: QName cannot end with colon: {container:}
Fatal Error: QName cannot end with colon: {panorama:}

我尝试通过 xsl:text、xsl:value-of 和 xsl:copy-of 输出脚本文本，但没有成功。我需要找到一种方法让 XSL 成功处理冒号，或者找到一种替代方法来利用 JS 库，避免在这种情况下使用冒号。有没有人遇到过类似的事情以及任何解决方案或解决方法？

编辑：对于没有任何 XSL 变量的更简单示例，我尝试了一个没有任何变量的测试模板。标记了关于冒号的相同致命错误。

<xsl:template name="myPanoramaTemplate">
<script>
  var viewer = new PhotoSphereViewer.Viewer({
    container: document.querySelector('#viewer'),
    panorama: 'path/to/panorama.jpg'
  });
</script>
</xsl:template>

Answer 1

可能是您 want/need 将 xsl:expand-text="no" 应用于文字结果元素 script:

<script xsl:expand-text="no">
  var viewer = new PhotoSphereViewer.Viewer({
    container: document.querySelector('#viewer'),
    panorama: '<xsl:value-of select="$image"/>'
  });
</script>

Answer 2

作为 Martin 建议的替代方案，将大括号加倍以避开大括号。

这里发生的事情是花括号之间的文本被解析为 XPath 表达式，但失败了，因为它不是有效的 XPath 语法。你可以这样写：

<script>
  var viewer = new PhotoSphereViewer.Viewer({{
    container: document.querySelector('#viewer'),
    panorama: '{$image}'
  }});
</script>

在 XSL 模板中包含带冒号的 JS 语法

Including JS syntax with colons in a XSL template

javascript

jquery

xslt

saxon

xslt-3.0