当 html 中有 backbone 模板时百里香叶无法解析

Question

Thyme leaf 无法解析 html 文件，我想在其中使用 backbonejs 视图的模板并给出以下错误消息：

org.xml.sax.SAXParseException: The content of elements must consist of well-formed character data or markup.

导致问题的html代码：

    <!-- models -->
<script type="text/template" id="template_slider">

  <div class="panel panel-primary">
    <div class="panel-heading">
      <h4 class="panel-title"><%= panel_title %></h4>
    </div>
    <div class="panel-body">
      <input id="<%= id %>" data-slider-id="<%= slider_id %>" type="text" data-slider-min="0" data-slider-max="100" data-slider-step="0.01" data-slider-value="0" />
    </div>
  </div>

</script>

这个问题的解决方案很简单，只需要使用 /*<![CDATA[*/ 和匹配的结束标记 /*]]>*/ 但是这样 backbone 就失败了，当我想创建新的查看抛出如下错误信息

Uncaught ReferenceError: panel_title is not defined(anonymous function) @ VM2747:6template @ underscore.js:1461access @ jquery.js:3626jQuery.fn.extend.html @ jquery.js:5486Backbone.View.extend.render @ map.Control.js:92Backbone.View.extend.initialize @ map.Control.js:83Backbone.View @ backbone.js:1224child @ backbone.js:1884(anonymous function) @ map.Control.js:96o.Mixin.Events.fireEvent @ leaflet.js:6o.Path.o.Path.extend._fireMouseEvent @ leaflet.js:7o.Path.o.Path.extend._onMouseClick @ leaflet.js:7t.(anonymous function).s @ leaflet.js:8

存在问题的js脚本：

 polyline.addEventListener('click', function() {
    var SliderView = Backbone.View.extend({
      initialize: function() {
        this.render();
      },
      render : function(){
        var variables = {
          panel_title : "Random",
          id : "my_id",
          slider_id : "my_idSlider"
        };
        var template = _.template( $("#template_slider").html(), variables );
        this.$el.html(template);
      }
    });

    var slider_view = new SliderView({ el: $("#slider_container")});
  });

我在没有 spring 和 thymeleaf 的情况下离线尝试了 js 代码工作正常。

Answer 1

您必须将 Thymaleaf 配置为在 HTML5Legacy 模式下进行解析。

由于我不知道您是如何使用 thymaleaf 的，因此我无法为您提供工作代码。

您通常在配置文件中执行此操作，或者通过注入视图配置器并在那里执行此操作...

当 html 中有 backbone 模板时百里香叶无法解析

Thyme leaf fail to parse when there is backbone template in html

javascript

backbone.js

thymeleaf